如何在TabLayout中增加选项卡的图标大小

时间:2015-12-12 08:35:58

标签: android

我正在尝试增加应用中标签的图标大小。图标大小是固定的尝试了很多方法,但没有任何工作,最后尝试以下,但没有大小的变化。如果任何人可以告诉我正确的方式,我会很高兴。谢谢提前。

这是我的代码,

Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
TabLayout tabLayout = (TabLayout) findViewById(R.id.tab_layout);
tabLayout.addTab(tabLayout.newTab().setIcon(R.drawable.my1));
tabLayout.addTab(tabLayout.newTab().setIcon(R.drawable.feed_s));
tabLayout.addTab(tabLayout.newTab().setIcon(R.drawable.add_ds1));
tabLayout.addTab(tabLayout.newTab().setIcon(R.drawable.history_ds));
tabLayout.setTabGravity(TabLayout.GRAVITY_FILL);

style.xml

<style name="AppTheme.ActionBar" parent="Widget.AppCompat.Light.ActionBar">
    <item name="android:layout_width">50dp</item>
    <item name="android:layout_height">50dp</item>
</style>

tablayout.xml

<android.support.design.widget.TabLayout
    android:id="@+id/tab_layout"
    android:layout_width="match_parent"
    android:layout_height="60dp"
    android:layout_below="@+id/toolbar"
    android:background="?attr/colorPrimary"
    android:elevation="6dp"
    android:theme="@style/AppTheme.ActionBar"/>

6 个答案:

答案 0 :(得分:48)

Hi I faced the same problem before and this is the best solution I could find:

You should use (setCustomView), first of all make a new layout file lets name it (customtab.xml):

time();

Then and for each tab do this: (use the same layout .xml)

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:scaleType="fitCenter"
        android:id="@+id/icon"
        android:layout_gravity="center_horizontal" />
</LinearLayout>

答案 1 :(得分:17)

如文档中所述,您可以使用ImageViewandroid:id="@android:id/icon"创建新布局,并将其设置为标签的自定义视图。 TabLayout将自动将图标放在带有android:id/icon

的内部ImageView中

然后在您的代码中,您可以在创建标签时调用setIcon(R.drawable.yourIcon)

然后,您可以在for循环中应用自定义布局:

mTabLayout.addTab(mTabLayout.newTab().setIcon(R.drawable.searchpin));
mTabLayout.addTab(mTabLayout.newTab().setIcon(R.drawable.discussionpin));
mTabLayout.addTab(mTabLayout.newTab().setIcon(R.drawable.userpin));

for (int i = 0; i < mTabLayout.getTabCount(); i++) {
    TabLayout.Tab tab = mTabLayout.getTabAt(i);
    if (tab != null) tab.setCustomView(R.layout.view_home_tab);
}

这是xml:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ImageView
        android:id="@android:id/icon"
        android:layout_width="@dimen/tab_icon_size"
        android:layout_height="@dimen/tab_icon_size"
        android:layout_centerInParent="true"/>

</RelativeLayout>

答案 2 :(得分:2)

无需采用任何xml视图。创建imageview运行时并将图像添加为视图:)

    for (int i = 0; i < tabLayout.getTabCount(); i++) {
        ImageView imageView = new ImageView(context);
        imageView.setImageResource(drawableImage);
        tabLayout.getTabAt(i).setCustomView(imageView);
    }

快乐编码

答案 3 :(得分:2)

如果您想在所有屏幕内更改我的意思是完整应用,那么您可以试试这个: 在名为 design_layout_tab_icon.xml 的布局文件夹中创建文件 并粘贴在代码

下面
<?xml version="1.0" encoding="utf-8"?>
<ImageView
       xmlns:android="http://schemas.android.com/apk/res/android"
       xmlns:tools="http://schemas.android.com/tools"
       android:id="@android:id/icon"
       android:layout_width="wrap_content"
       android:layout_height="match_parent"
       android:layout_gravity="center_horizontal"
       android:scaleType="fitCenter"
       tools:src="@mipmap/ic_launcher"/>

不要更改id留下它并在屏幕上标签栏设置一些你想要的高度和中提琴!!! 它适用于所有地方

答案 4 :(得分:0)

这是自定义的 TabLayout ,它可以提供很多帮助!

public class TabView extends TabLayout {

public TabView(Context context) {
    super(context);
    init();
}

public TabView(Context context, AttributeSet attrs) {
    super(context, attrs);
    init();
}

public TabView(Context context, AttributeSet attrs, int defStyleAttr) {
    super(context, attrs, defStyleAttr);
    init();
}

private void init() {
    int padding = 10;

    int[] icons = new int[]{R.drawable.ic_tel, R.drawable.ic_speaker, R.drawable.ic_camera, R.drawable.ic_home};

    for (int i = 0; i < icons.length; i++) {
        ImageView imageView = new ImageView(getContext());
        imageView.setBackgroundColor(Color.TRANSPARENT);
        imageView.setImageResource(icons[i]);
        imageView.setScaleType(ImageView.ScaleType.CENTER_INSIDE);
        imageView.setPadding(padding, padding, padding, padding);
        if (i==3){
            addTab(newTab().setCustomView(imageView), i , true);
        } else {
            addTab(newTab().setCustomView(imageView), i);
        }
    }

}

}

答案 5 :(得分:0)

    View view5 = getLayoutInflater().inflate(R.layout.custom_icon, null);
    view5.findViewById(R.id.iconImg).setBackgroundResource(R.drawable.ambulance);
    icon_text=(TextView)view5.findViewById(R.id.icon_text);
    icon_text.setText("Blood Bank");
    tabLayout.addTab(tabLayout.newTab().setCustomView(view5));

    tabLayout.getTabAt(0).setIcon(tabIcons[0]).setCustomView(view1);