javaandroidandroid-layoutnavigationandroid-viewpager
ViewPager under of BottomNavigation
I have list in viewpager and i have audio player on bottom. But my viewpager doesn't end the starting of audio player. I can't see my last 2 - 3 items in viewpager. And i don't wanna use MarginBottom.
some screenshots
my activity.xml
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/coordinatorLayout"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<!-- AppBar Layout -->
<android.support.design.widget.AppBarLayout
android:id="@+id/appBarLayout"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="fill_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />
<!-- Tab Layout for creating tabs -->
<android.support.design.widget.TabLayout
android:id="@+id/tabLayout"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
</android.support.design.widget.AppBarLayout>
<!-- Helps handing the Fragments for each Tab -->
<android.support.v4.view.ViewPager
android:id="@+id/viewPager"
android:layout_width="fill_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior" />
<android.support.design.widget.BottomNavigationView
android:layout_width="fill_parent"
android:layout_height="90dp"
android:layout_marginTop="5dp"
android:layout_below="@+id/viewPager"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
android:layout_gravity="bottom"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light">
<android.support.design.widget.NavigationView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_alignParentBottom="true"
android:paddingLeft="10dp"
android:layout_gravity="center"
android:paddingRight="10dp"
android:orientation="horizontal">
<ImageButton
android:id="@+id/btnBackward"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginLeft="50dp"
android:layout_marginBottom="4dp"
android:src="@android:drawable/ic_media_rew" />
<ImageButton
android:id="@+id/btnPlay"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="@+id/btnBackward"
android:layout_marginLeft="20dp"
android:layout_toRightOf="@+id/btnBackward"
android:src="@android:drawable/ic_media_play" />
<ImageButton
android:id="@+id/btnPause"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="@+id/btnPlay"
android:layout_marginLeft="20dp"
android:layout_toRightOf="@+id/btnPlay"
android:src="@android:drawable/ic_media_pause" />
<ImageButton
android:id="@+id/btnForward"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="@+id/btnPause"
android:layout_marginLeft="20dp"
android:layout_toRightOf="@+id/btnPause"
android:contentDescription="@+id/imageButton3"
android:src="@android:drawable/ic_media_ff" />
<TextView
android:id="@+id/txtStartTime"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="@+id/sBar"
android:text="0 min, 0 sec" />
<SeekBar
android:id="@+id/sBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="@+id/btnBackward"
android:layout_toLeftOf="@+id/txtSongTime"
android:layout_toRightOf="@+id/txtStartTime" />
<TextView
android:id="@+id/txtSongTime"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="@+id/sBar"
android:layout_toRightOf="@+id/btnForward"
android:text="0 min, 0 sec " />
</RelativeLayout>
</android.support.design.widget.NavigationView>
</android.support.design.widget.BottomNavigationView>
</android.support.design.widget.CoordinatorLayout>
I tried a couple solution but none of them worked. Only solution i can find is using marginbottom, but i think that would be bad choices.
Any help would be great. Thanks.
Solution
You can solve this by wrapping the ViewPager and the BottomNavigationView within a ConstraintLayout and add a constraint so that the bottom part of the ViewPager should be at the top part of the BottomNavigationView using: app:layout_constraintBottom_toTopOf attribute at the ViewPager
<android.support.v4.view.ViewPager
android:id="@+id/viewPager"
...
app:layout_constraintBottom_toTopOf="@id/bottom_nav_view"
And then make the height of the ViewPager match the constraints instead of the fill_parent or match_parent
To apply this change your layout to:
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/coordinatorLayout"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<!-- AppBar Layout -->
<android.support.design.widget.AppBarLayout
android:id="@+id/appBarLayout"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="fill_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />
<!-- Tab Layout for creating tabs -->
<android.support.design.widget.TabLayout
android:id="@+id/tabLayout"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
</android.support.design.widget.AppBarLayout>
<!-- Helps handing the Fragments for each Tab -->
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v4.view.ViewPager
android:id="@+id/viewPager"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
app:layout_constraintBottom_toTopOf="@id/bottom_nav_view"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<android.support.design.widget.BottomNavigationView
android:id="@+id/bottom_nav_view"
android:layout_width="match_parent"
android:layout_height="90dp"
android:layout_marginTop="5dp"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:layout_constraintBottom_toBottomOf="parent"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light">
<android.support.design.widget.NavigationView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_alignParentBottom="true"
android:layout_gravity="center"
android:orientation="horizontal"
android:paddingLeft="10dp"
android:paddingRight="10dp">
<ImageButton
android:id="@+id/btnBackward"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginLeft="50dp"
android:layout_marginBottom="4dp"
android:src="@android:drawable/ic_media_rew" />
<ImageButton
android:id="@+id/btnPlay"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="@+id/btnBackward"
android:layout_marginLeft="20dp"
android:layout_toRightOf="@+id/btnBackward"
android:src="@android:drawable/ic_media_play" />
<ImageButton
android:id="@+id/btnPause"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="@+id/btnPlay"
android:layout_marginLeft="20dp"
android:layout_toRightOf="@+id/btnPlay"
android:src="@android:drawable/ic_media_pause" />
<ImageButton
android:id="@+id/btnForward"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="@+id/btnPause"
android:layout_marginLeft="20dp"
android:layout_toRightOf="@+id/btnPause"
android:contentDescription="@+id/imageButton3"
android:src="@android:drawable/ic_media_ff" />
<TextView
android:id="@+id/txtStartTime"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="@+id/sBar"
android:text="0 min, 0 sec" />
<SeekBar
android:id="@+id/sBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="@+id/btnBackward"
android:layout_toLeftOf="@+id/txtSongTime"
android:layout_toRightOf="@+id/txtStartTime" />
<TextView
android:id="@+id/txtSongTime"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="@+id/sBar"
android:layout_toRightOf="@+id/btnForward"
android:text="0 min, 0 sec " />
</RelativeLayout>
</android.support.design.widget.NavigationView>
</android.support.design.widget.BottomNavigationView>
</android.support.constraint.ConstraintLayout>
</android.support.design.widget.CoordinatorLayout>
Edit: It's kind of worked. Bottom is fixed bot now i can't see Top, first 2 3 item under appBar. i tried couple of codes something like that
app:layout_constraintBottom_toBottomOf="@id/appBarLayout"but doesn't worked.Solution:
app:layout_constraintTop_toBottomOf="@+id/appBarLayout"and to gradle'com.android.support.constraint:constraint-layout:1.0.2'now it's working.
- Keep numbers which appear in both columns, in J lang
- Differentiation in J
- How to reshape an array with an arbitrary size in one dimension?
- Why is Insert (fold) right associative
- Write 4 : 'x&{.&.;: y' tacitly
- Alignment issue when printing formatted prime numbers in J language
- How can I define a verb in J that applies a different verb alternately to each atom in a list?
- How to get user input in the J programming language
- How to unbox a list of boxed lists of differing lengths in J?
- How can I fix 'noun result was required' error in J?
- In j, how can I define a verb locally in one scope and pass it to a defined adverb?
- Convert boxed array to normal array?
- Read column of CSV file as array
- Replace atom in array of strings
- What does the dyad `=` do to boxed strings?
- Index of minimum element using J
- How can I take the outer product of string vectors in J?
- Building an array of verbs in J
- Reading in multidigit command line parameter
- Amend with bond to new data shows unexpected behaviour
- How to turn a table or matrix into a (flat) list in J
- How to run dissect in J?
- How to define selection using index function in J
- How to exit the J console?
- Find 4-neighbors using J
- Writing custom verbs in J
- How do I negate a selector in J lang?
- How to use arbitrary selector in interchange in J lang?
- different result once square root is added inside tacit
- Sum of arrays with repeated indices