android - 像 Youtube 一样的 Android 自定义 Tablayout
问题描述
例外:点击此链接查看图片
如何创建像 youtube 这样的自定义标签布局。我通过使用下面的代码实现了相同的结果,但 tablayout 在某些设备上会缩小。每个设备都需要为 tablayout 设置不同的高度。那么有没有办法通过创建自定义类来绘制呢?如何扩展 Tablayout 并绘制和使用相同的功能?
<androidx.coordinatorlayout.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:animateLayoutChanges="true">
<com.google.android.material.appbar.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:animateLayoutChanges="true"
android:fitsSystemWindows="true"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
<com.google.android.material.tabs.TabLayout
style="@style/TabLayoutStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:minHeight="48dp"
app:tabMaxWidth="200dp"
app:tabMinWidth="20dp"
app:tabPaddingBottom="2dp" />
</com.google.android.material.appbar.AppBarLayout>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
<style name="TabLayoutStyle" parent="Widget.Design.TabLayout">
<item name="tabTextAppearance">@style/TabLayoutTextAppearance</item>
<item name="android:layout_gravity">center</item>
<item name="android:gravity">center</item>
<item name="background">@drawable/corner_radius</item>
<item name="tabBackground">@drawable/backgound_rounded</item>
<item name="android:clipToPadding">false</item>
<item name="tabIndicatorHeight">0dp</item>
<item name="border_color">@color/background</item>
<item name="tabSelectedTextColor">@color/black</item>
<item name="tabTextColor">@color/gray</item>
<item name="tabIndicatorFullWidth">false</item>
<item name="tabIndicatorColor">@android:color/transparent</item>
<item name="tabMode">scrollable</item>
<item name="tabGravity">fill</item>
</style>
<style name="TabLayoutTextAppearance" parent="TextAppearance.Design.Tab">
<item name="android:textSize">12dp</item>
<item name="textAllCaps">false</item>
<item name="fontWeight">100</item>
<item name="fontFamily">@font/regular</item>
</style>
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_selected="true">
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
<corners android:radius="@dimen/dimen_50dp" />
<stroke android:color="@color/white" />
<solid android:color="@color/white" />
</shape>
</item>
<item android:state_selected="false">
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
<corners android:radius="@dimen/dimen_50dp" />
<stroke android:width="0.5dp"
android:color="@color/gray" />
<solid android:color="@color/black" />
</shape>
</item>
</selector>
val p = tab.layoutParams as MarginLayoutParams
if (i == 0) {
p.setMargins(40, 20, 30, 20)
} else {
p.setMargins(0, 20, 30, 20)
}
tab.requestLayout()
我管理标签布局的高度
if (activity?.resources?.configuration?.smallestScreenWidthDp != null &&
activity?.resources?.configuration?.smallestScreenWidthDp!! == 411) {
val params = tab.layoutParams
params.height = 110
params.width = ViewGroup.LayoutParams.MATCH_PARENT
tab.layoutParams = params
} else if (activity?.resources?.configuration?.smallestScreenWidthDp != null &&
activity?.resources?.configuration?.smallestScreenWidthDp!! == 360) {
val params = tab.layoutParams
params.height = 68
params.width = ViewGroup.LayoutParams.MATCH_PARENT
tab.layoutParams = params
}
解决方案
推荐阅读
- scala - HDFS 文件拆分命令:使用 spark-submit 的 Spark/Scala
- javascript - 使用javascript将html表格转换为csv时如何合并或组合单元格
- c# - 如何防止使用 ListBox 中的箭头在项目之间切换?
- javascript - 使反应组件可点击
- qt - Qt:如何删除白线?
- mysql - MySQL BETWEEN 查询不使用索引
- excel - 有没有办法在 VBA 中编写这个 Excel 公式?
- regex - 在用户输入答案的开头和结尾排除单词或字符的正则表达式
- php - php 和 apache 在 docker 中一起使用
- php - 我的注册页面中一直出现错误“ERR_TOO_MANY_REDIRECTS”