feat: smooth navbar indicator
This commit is contained in:
rebelonion
parent
94e3dff909
commit
89aaef8355
2 changed files with 81 additions and 71 deletions
|
|
@ -13,7 +13,7 @@ class TripleNavAdapter(
|
||||||
private val nav3: AnimatedBottomBar,
|
private val nav3: AnimatedBottomBar,
|
||||||
anime: Boolean,
|
anime: Boolean,
|
||||||
format: String,
|
format: String,
|
||||||
isVertical: Boolean = false
|
private val isScreenVertical: Boolean = false
|
||||||
) {
|
) {
|
||||||
var selected: Int = 0
|
var selected: Int = 0
|
||||||
var selectionListener: ((Int, Int) -> Unit)? = null
|
var selectionListener: ((Int, Int) -> Unit)? = null
|
||||||
|
|
@ -31,16 +31,12 @@ class TripleNavAdapter(
|
||||||
}
|
}
|
||||||
val commentTab = nav3.createTab(R.drawable.ic_round_comment_24, R.string.comments, R.id.comment)
|
val commentTab = nav3.createTab(R.drawable.ic_round_comment_24, R.string.comments, R.id.comment)
|
||||||
nav1.addTab(infoTab)
|
nav1.addTab(infoTab)
|
||||||
nav2.addTab(watchTab)
|
|
||||||
nav3.addTab(commentTab)
|
|
||||||
nav1.visibility = ViewGroup.VISIBLE
|
nav1.visibility = ViewGroup.VISIBLE
|
||||||
nav2.visibility = ViewGroup.VISIBLE
|
if (isScreenVertical) {
|
||||||
nav3.visibility = ViewGroup.VISIBLE
|
nav2.visibility = ViewGroup.GONE
|
||||||
if (!isVertical) {
|
nav3.visibility = ViewGroup.GONE
|
||||||
nav1.indicatorColor = Color.TRANSPARENT
|
nav1.addTab(watchTab)
|
||||||
nav2.indicatorColor = Color.TRANSPARENT
|
nav1.addTab(commentTab)
|
||||||
nav3.indicatorColor = Color.TRANSPARENT
|
|
||||||
} else {
|
|
||||||
nav1.updateLayoutParams<ViewGroup.MarginLayoutParams> {
|
nav1.updateLayoutParams<ViewGroup.MarginLayoutParams> {
|
||||||
bottomMargin = navBarHeight
|
bottomMargin = navBarHeight
|
||||||
}
|
}
|
||||||
|
|
@ -50,6 +46,38 @@ class TripleNavAdapter(
|
||||||
nav3.updateLayoutParams<ViewGroup.MarginLayoutParams> {
|
nav3.updateLayoutParams<ViewGroup.MarginLayoutParams> {
|
||||||
bottomMargin = navBarHeight
|
bottomMargin = navBarHeight
|
||||||
}
|
}
|
||||||
|
} else {
|
||||||
|
nav1.indicatorColor = Color.TRANSPARENT
|
||||||
|
nav2.indicatorColor = Color.TRANSPARENT
|
||||||
|
nav3.indicatorColor = Color.TRANSPARENT
|
||||||
|
nav2.visibility = ViewGroup.VISIBLE
|
||||||
|
nav3.visibility = ViewGroup.VISIBLE
|
||||||
|
nav2.addTab(watchTab)
|
||||||
|
nav3.addTab(commentTab)
|
||||||
|
nav2.setOnTabSelectListener(object : AnimatedBottomBar.OnTabSelectListener {
|
||||||
|
override fun onTabSelected(
|
||||||
|
lastIndex: Int,
|
||||||
|
lastTab: AnimatedBottomBar.Tab?,
|
||||||
|
newIndex: Int,
|
||||||
|
newTab: AnimatedBottomBar.Tab
|
||||||
|
) {
|
||||||
|
selected = 1
|
||||||
|
deselectOthers(selected)
|
||||||
|
selectionListener?.invoke(selected, newTab.id)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
nav3.setOnTabSelectListener(object : AnimatedBottomBar.OnTabSelectListener {
|
||||||
|
override fun onTabSelected(
|
||||||
|
lastIndex: Int,
|
||||||
|
lastTab: AnimatedBottomBar.Tab?,
|
||||||
|
newIndex: Int,
|
||||||
|
newTab: AnimatedBottomBar.Tab
|
||||||
|
) {
|
||||||
|
selected = 2
|
||||||
|
deselectOthers(selected)
|
||||||
|
selectionListener?.invoke(selected, newTab.id)
|
||||||
|
}
|
||||||
|
})
|
||||||
}
|
}
|
||||||
nav1.setOnTabSelectListener(object : AnimatedBottomBar.OnTabSelectListener {
|
nav1.setOnTabSelectListener(object : AnimatedBottomBar.OnTabSelectListener {
|
||||||
override fun onTabSelected(
|
override fun onTabSelected(
|
||||||
|
|
@ -58,32 +86,10 @@ class TripleNavAdapter(
|
||||||
newIndex: Int,
|
newIndex: Int,
|
||||||
newTab: AnimatedBottomBar.Tab
|
newTab: AnimatedBottomBar.Tab
|
||||||
) {
|
) {
|
||||||
selected = 0
|
if (!isScreenVertical) {
|
||||||
deselectOthers(selected)
|
selected = 0
|
||||||
selectionListener?.invoke(selected, newTab.id)
|
deselectOthers(selected)
|
||||||
}
|
} else selected = newIndex
|
||||||
})
|
|
||||||
nav2.setOnTabSelectListener(object : AnimatedBottomBar.OnTabSelectListener {
|
|
||||||
override fun onTabSelected(
|
|
||||||
lastIndex: Int,
|
|
||||||
lastTab: AnimatedBottomBar.Tab?,
|
|
||||||
newIndex: Int,
|
|
||||||
newTab: AnimatedBottomBar.Tab
|
|
||||||
) {
|
|
||||||
selected = 1
|
|
||||||
deselectOthers(selected)
|
|
||||||
selectionListener?.invoke(selected, newTab.id)
|
|
||||||
}
|
|
||||||
})
|
|
||||||
nav3.setOnTabSelectListener(object : AnimatedBottomBar.OnTabSelectListener {
|
|
||||||
override fun onTabSelected(
|
|
||||||
lastIndex: Int,
|
|
||||||
lastTab: AnimatedBottomBar.Tab?,
|
|
||||||
newIndex: Int,
|
|
||||||
newTab: AnimatedBottomBar.Tab
|
|
||||||
) {
|
|
||||||
selected = 2
|
|
||||||
deselectOthers(selected)
|
|
||||||
selectionListener?.invoke(selected, newTab.id)
|
selectionListener?.invoke(selected, newTab.id)
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
@ -105,13 +111,17 @@ class TripleNavAdapter(
|
||||||
}
|
}
|
||||||
|
|
||||||
fun selectTab(tab: Int) {
|
fun selectTab(tab: Int) {
|
||||||
when (tab) {
|
|
||||||
0 -> nav1.selectTabAt(0)
|
|
||||||
1 -> nav2.selectTabAt(0)
|
|
||||||
2 -> nav3.selectTabAt(0)
|
|
||||||
}
|
|
||||||
selected = tab
|
selected = tab
|
||||||
deselectOthers(selected)
|
if (!isScreenVertical) {
|
||||||
|
when (tab) {
|
||||||
|
0 -> nav1.selectTabAt(0)
|
||||||
|
1 -> nav2.selectTabAt(0)
|
||||||
|
2 -> nav3.selectTabAt(0)
|
||||||
|
}
|
||||||
|
deselectOthers(selected)
|
||||||
|
} else {
|
||||||
|
nav1.selectTabAt(selected)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
fun setVisibility(visibility: Int) {
|
fun setVisibility(visibility: Int) {
|
||||||
|
|
|
||||||
|
|
@ -2,9 +2,9 @@
|
||||||
<androidx.coordinatorlayout.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
|
<androidx.coordinatorlayout.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
|
||||||
xmlns:app="http://schemas.android.com/apk/res-auto"
|
xmlns:app="http://schemas.android.com/apk/res-auto"
|
||||||
xmlns:tools="http://schemas.android.com/tools"
|
xmlns:tools="http://schemas.android.com/tools"
|
||||||
android:fitsSystemWindows="false"
|
|
||||||
android:layout_width="match_parent"
|
android:layout_width="match_parent"
|
||||||
android:layout_height="match_parent">
|
android:layout_height="match_parent"
|
||||||
|
android:fitsSystemWindows="false">
|
||||||
|
|
||||||
<com.google.android.material.appbar.AppBarLayout
|
<com.google.android.material.appbar.AppBarLayout
|
||||||
android:id="@+id/mediaAppBar"
|
android:id="@+id/mediaAppBar"
|
||||||
|
|
@ -235,8 +235,8 @@
|
||||||
android:id="@+id/mediaViewPager"
|
android:id="@+id/mediaViewPager"
|
||||||
android:layout_width="match_parent"
|
android:layout_width="match_parent"
|
||||||
android:layout_height="match_parent"
|
android:layout_height="match_parent"
|
||||||
android:nestedScrollingEnabled="true"
|
|
||||||
android:layout_marginBottom="72dp"
|
android:layout_marginBottom="72dp"
|
||||||
|
android:nestedScrollingEnabled="true"
|
||||||
tools:ignore="SpeakableTextPresentCheck" />
|
tools:ignore="SpeakableTextPresentCheck" />
|
||||||
</LinearLayout>
|
</LinearLayout>
|
||||||
|
|
||||||
|
|
@ -247,39 +247,39 @@
|
||||||
android:layout_gravity="center|bottom"
|
android:layout_gravity="center|bottom"
|
||||||
android:orientation="horizontal">
|
android:orientation="horizontal">
|
||||||
|
|
||||||
<nl.joery.animatedbottombar.AnimatedBottomBar
|
<nl.joery.animatedbottombar.AnimatedBottomBar
|
||||||
android:id="@+id/mediaTab1"
|
android:id="@+id/mediaTab1"
|
||||||
android:layout_width="0dp"
|
android:layout_width="0dp"
|
||||||
android:layout_height="72dp"
|
android:layout_height="72dp"
|
||||||
android:layout_weight="1"
|
android:layout_gravity="center_horizontal|bottom"
|
||||||
android:layout_gravity="center_horizontal|bottom"
|
android:layout_weight="1"
|
||||||
android:background="?attr/colorSurface"
|
android:background="?attr/colorSurface"
|
||||||
android:padding="0dp"
|
android:padding="0dp"
|
||||||
app:abb_animationInterpolator="@anim/over_shoot"
|
app:abb_animationInterpolator="@anim/over_shoot"
|
||||||
app:abb_selectedTabType="text"
|
app:abb_indicatorAppearance="round"
|
||||||
app:abb_textAppearance="@style/NavBarText"
|
app:abb_indicatorLocation="top"
|
||||||
|
app:abb_selectedTabType="text"
|
||||||
|
app:abb_textAppearance="@style/NavBarText"
|
||||||
app:itemActiveIndicatorStyle="@style/BottomNavBar"
|
app:itemActiveIndicatorStyle="@style/BottomNavBar"
|
||||||
app:itemIconTint="@color/tab_layout_icon"
|
app:itemIconTint="@color/tab_layout_icon"
|
||||||
app:itemRippleColor="#00000000"
|
app:itemRippleColor="#00000000"
|
||||||
app:itemTextAppearanceActive="@style/NavBarText"
|
app:itemTextAppearanceActive="@style/NavBarText"
|
||||||
app:itemTextAppearanceInactive="@style/NavBarText"
|
app:itemTextAppearanceInactive="@style/NavBarText"
|
||||||
app:itemTextColor="@color/tab_layout_icon" />
|
app:itemTextColor="@color/tab_layout_icon" />
|
||||||
|
|
||||||
<nl.joery.animatedbottombar.AnimatedBottomBar
|
<nl.joery.animatedbottombar.AnimatedBottomBar
|
||||||
android:id="@+id/mediaTab2"
|
android:id="@+id/mediaTab2"
|
||||||
android:layout_width="0dp"
|
android:layout_width="0dp"
|
||||||
android:layout_height="72dp"
|
android:layout_height="72dp"
|
||||||
android:layout_weight="1"
|
|
||||||
android:layout_gravity="center_horizontal|bottom"
|
android:layout_gravity="center_horizontal|bottom"
|
||||||
|
android:layout_weight="1"
|
||||||
android:background="?attr/colorSurface"
|
android:background="?attr/colorSurface"
|
||||||
android:padding="0dp"
|
android:padding="0dp"
|
||||||
app:abb_animationInterpolator="@anim/over_shoot"
|
app:abb_animationInterpolator="@anim/over_shoot"
|
||||||
|
app:abb_indicatorAppearance="round"
|
||||||
|
app:abb_indicatorLocation="top"
|
||||||
app:abb_selectedTabType="text"
|
app:abb_selectedTabType="text"
|
||||||
app:abb_textAppearance="@style/NavBarText"
|
app:abb_textAppearance="@style/NavBarText"
|
||||||
|
|
||||||
|
|
||||||
app:itemActiveIndicatorStyle="@style/BottomNavBar"
|
app:itemActiveIndicatorStyle="@style/BottomNavBar"
|
||||||
app:itemIconTint="@color/tab_layout_icon"
|
app:itemIconTint="@color/tab_layout_icon"
|
||||||
app:itemRippleColor="#00000000"
|
app:itemRippleColor="#00000000"
|
||||||
|
|
@ -291,15 +291,15 @@
|
||||||
android:id="@+id/mediaTab3"
|
android:id="@+id/mediaTab3"
|
||||||
android:layout_width="0dp"
|
android:layout_width="0dp"
|
||||||
android:layout_height="72dp"
|
android:layout_height="72dp"
|
||||||
android:layout_weight="1"
|
|
||||||
android:layout_gravity="center_horizontal|bottom"
|
android:layout_gravity="center_horizontal|bottom"
|
||||||
|
android:layout_weight="1"
|
||||||
android:background="?attr/colorSurface"
|
android:background="?attr/colorSurface"
|
||||||
android:padding="0dp"
|
android:padding="0dp"
|
||||||
app:abb_animationInterpolator="@anim/over_shoot"
|
app:abb_animationInterpolator="@anim/over_shoot"
|
||||||
|
app:abb_indicatorAppearance="round"
|
||||||
|
app:abb_indicatorLocation="top"
|
||||||
app:abb_selectedTabType="text"
|
app:abb_selectedTabType="text"
|
||||||
app:abb_textAppearance="@style/NavBarText"
|
app:abb_textAppearance="@style/NavBarText"
|
||||||
|
|
||||||
|
|
||||||
app:itemActiveIndicatorStyle="@style/BottomNavBar"
|
app:itemActiveIndicatorStyle="@style/BottomNavBar"
|
||||||
app:itemIconTint="@color/tab_layout_icon"
|
app:itemIconTint="@color/tab_layout_icon"
|
||||||
app:itemRippleColor="#00000000"
|
app:itemRippleColor="#00000000"
|
||||||
|
|
@ -375,6 +375,6 @@
|
||||||
android:layout_width="match_parent"
|
android:layout_width="match_parent"
|
||||||
android:layout_height="match_parent"
|
android:layout_height="match_parent"
|
||||||
android:paddingTop="16dp"
|
android:paddingTop="16dp"
|
||||||
android:visibility="gone"/>
|
android:visibility="gone" />
|
||||||
|
|
||||||
</androidx.coordinatorlayout.widget.CoordinatorLayout>
|
</androidx.coordinatorlayout.widget.CoordinatorLayout>
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue