Skip to content

Commit cc517e8

Browse files
lcdsmaolcdsmao
authored
Merge pull request #17 from cats-oss/add-examples
Add examples
2 parents b9aae29 + c1df35c commit cc517e8

File tree

16 files changed

+269
-2
lines changed

16 files changed

+269
-2
lines changed

‎README.md‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,9 @@ Easily create `TabLayout.Tab` animations that sync with the scrolling progress o
1515

1616
## Demo
1717

18-
<img src="art/demo.gif" width="30%">
18+
|[Tab](sample/src/main/java/jp/co/cyberagent/android/tabanimationsample/TextTabActivity.kt)|[Indicator](sample/src/main/java/jp/co/cyberagent/android/tabanimationsample/IndicatorActivity.kt)|[Bottom Navigation](sample/src/main/java/jp/co/cyberagent/android/tabanimationsample/BottomNavigationActivity.kt)|
19+
|-|-|-|
20+
|<img src=art/demo_tab.gif width=600 />|<img src=art/demo_indicator.gif width=600 />|<img src=art/demo_bottom_navigation.gif width=600 />|
1921

2022
## Usage
2123

‎art/demo.gif‎

-591 KB
Binary file not shown.

‎art/demo_bottom_navigation.gif‎

501 KB
Loading

‎art/demo_indicator.gif‎

276 KB
Loading

‎art/demo_tab.gif‎

420 KB
Loading

‎sample/src/main/AndroidManifest.xml‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -26,6 +26,8 @@
2626
<activity android:name=".TextTopIconTabActivity" />
2727
<activity android:name=".TextLeadingIconTabActivity" />
2828
<activity android:name=".TextTopIconTab2Activity" />
29+
<activity android:name=".IndicatorActivity" />
30+
<activity android:name=".BottomNavigationActivity" />
2931
</application>
3032

3133
</manifest>

‎sample/src/main/java/jp/co/cyberagent/android/tabanimationsample/BottomNavigationActivity.kt‎

Lines changed: 62 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,62 @@
1+
package jp.co.cyberagent.android.tabanimationsample
2+
3+
import android.os.Bundle
4+
import android.view.LayoutInflater
5+
import android.view.View
6+
import android.view.ViewGroup
7+
import android.widget.ImageView
8+
import android.widget.TextView
9+
import androidx.appcompat.app.AppCompatActivity
10+
import androidx.recyclerview.widget.RecyclerView
11+
import jp.co.cyberagent.android.tabanimation.setupAnimationTabWithViewPager
12+
import jp.co.cyberagent.android.tabanimation.viewIdAnimationInfo
13+
import kotlinx.android.synthetic.main.activity_bottom_navigation.*
14+
import kotlinx.android.synthetic.main.fragment_pager.view.*
15+
import kotlinx.android.synthetic.main.layout_bottom_navigation_item.view.*
16+
17+
class BottomNavigationActivity : AppCompatActivity() {
18+
19+
override fun onCreate(savedInstanceState: Bundle?) {
20+
super.onCreate(savedInstanceState)
21+
setContentView(R.layout.activity_bottom_navigation)
22+
23+
view_pager.adapter = object : RecyclerView.Adapter<RecyclerView.ViewHolder>() {
24+
25+
override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): RecyclerView.ViewHolder {
26+
val view =
27+
LayoutInflater.from(parent.context).inflate(R.layout.fragment_pager, parent, false)
28+
return object : RecyclerView.ViewHolder(view) {}
29+
}
30+
31+
override fun getItemCount(): Int = 4
32+
33+
override fun onBindViewHolder(holder: RecyclerView.ViewHolder, position: Int) =
34+
with(holder.itemView) {
35+
text_view.text = "Page ${position + 1}"
36+
}
37+
}
38+
39+
val animationInfo = viewIdAnimationInfo {
40+
animate<ImageView, Float>(R.id.image) {
41+
property(View.TRANSLATION_Y)
42+
startValue { it.height.toFloat() }
43+
endValue { 0f }
44+
}
45+
animate<TextView, Float>(R.id.text) {
46+
property(View.TRANSLATION_Y)
47+
startValue { 0f }
48+
endValue { -it.height.toFloat() }
49+
}
50+
}
51+
tab_indicator.setupAnimationTabWithViewPager(
52+
view_pager,
53+
animationInfo,
54+
R.layout.layout_bottom_navigation_item
55+
) { _, view, pos ->
56+
with(view) {
57+
text.text = pagerSet[pos].text
58+
image.setImageResource(pagerSet[pos].icon)
59+
}
60+
}
61+
}
62+
}

‎sample/src/main/java/jp/co/cyberagent/android/tabanimationsample/IndicatorActivity.kt‎

Lines changed: 69 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,69 @@
1+
package jp.co.cyberagent.android.tabanimationsample
2+
3+
import android.content.res.ColorStateList
4+
import android.graphics.Color
5+
import android.os.Bundle
6+
import android.view.LayoutInflater
7+
import android.view.View
8+
import android.view.ViewGroup
9+
import android.widget.ImageView
10+
import androidx.appcompat.app.AppCompatActivity
11+
import androidx.core.widget.ImageViewCompat
12+
import androidx.recyclerview.widget.RecyclerView
13+
import jp.co.cyberagent.android.tabanimation.property
14+
import jp.co.cyberagent.android.tabanimation.setupAnimationTabWithViewPager
15+
import jp.co.cyberagent.android.tabanimation.viewIdAnimationInfo
16+
import kotlinx.android.synthetic.main.activity_indicator.*
17+
import kotlinx.android.synthetic.main.fragment_pager.view.*
18+
19+
class IndicatorActivity : AppCompatActivity() {
20+
21+
override fun onCreate(savedInstanceState: Bundle?) {
22+
super.onCreate(savedInstanceState)
23+
setContentView(R.layout.activity_indicator)
24+
25+
view_pager.adapter = object : RecyclerView.Adapter<RecyclerView.ViewHolder>() {
26+
27+
override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): RecyclerView.ViewHolder {
28+
val view =
29+
LayoutInflater.from(parent.context).inflate(R.layout.fragment_pager, parent, false)
30+
return object : RecyclerView.ViewHolder(view) {}
31+
}
32+
33+
override fun getItemCount(): Int = 5
34+
35+
override fun onBindViewHolder(holder: RecyclerView.ViewHolder, position: Int) =
36+
with(holder.itemView) {
37+
setBackgroundColor(Color.parseColor("#141418"))
38+
text_view.text = "Page ${position + 1}"
39+
text_view.setTextColor(Color.WHITE)
40+
}
41+
}
42+
43+
val animationInfo = viewIdAnimationInfo {
44+
animate<ImageView, Int>(R.id.image_indicator) {
45+
property(
46+
getter = { ImageViewCompat.getImageTintList(this)!!.defaultColor },
47+
setter = { ImageViewCompat.setImageTintList(this, ColorStateList.valueOf(it)) }
48+
)
49+
startValue(Color.parseColor("#37373D"))
50+
endValue(Color.parseColor("#979797"))
51+
}
52+
animate<ImageView, Float>(R.id.image_indicator) {
53+
property(View.SCALE_X)
54+
startValue(1f)
55+
endValue(1.4f)
56+
}
57+
animate<ImageView, Float>(R.id.image_indicator) {
58+
property(View.SCALE_Y)
59+
startValue(1f)
60+
endValue(1.4f)
61+
}
62+
}
63+
tab_indicator.setupAnimationTabWithViewPager(
64+
view_pager,
65+
animationInfo,
66+
R.layout.layout_indicator
67+
)
68+
}
69+
}

‎sample/src/main/java/jp/co/cyberagent/android/tabanimationsample/MainActivity.kt‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,14 @@ class MainActivity : AppCompatActivity() {
1111
super.onCreate(savedInstanceState)
1212
setContentView(R.layout.activity_main)
1313

14+
button_sample_indicator.setOnClickListener {
15+
startActivity(Intent(this, IndicatorActivity::class.java))
16+
}
17+
18+
button_sample_bottom_navigation.setOnClickListener {
19+
startActivity(Intent(this, BottomNavigationActivity::class.java))
20+
}
21+
1422
text_tab.setOnClickListener {
1523
startActivity(Intent(this, TextTabActivity::class.java))
1624
}

‎sample/src/main/res/drawable/ic_oval.xml‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
<?xml version="1.0" encoding="utf-8"?>
2+
<shape xmlns:android="http://schemas.android.com/apk/res/android"
3+
android:shape="oval"
4+
android:tint="#000000"
5+
>
6+
7+
</shape>

0 commit comments

Comments
 (0)