0

My project includes 6 icons on tabLayout. They all put to tabs programmatically, not with ImageView from layout. Now, it must be increased size of this icons for tablet screen.

I tried so much things; tried increase icon size, tried layout_ width and layout_height of tabItems. But that's all didn't work.

How can I increase icons size on tabLayout? Hope someone can help me for this.

Result_Activity.java

private Integer[] images;
Integer[] domesticImages = {
        R.drawable.ic_directions_bus_black_24dp,
        R.drawable.ic_flight_takeoff_black_24dp,
        R.drawable.ic_directions_boat_black_24dp,
        R.drawable.ic_train_black_24dp,
        R.drawable.ic_hotel,
        R.drawable.ic_rent_a_car
};
private Integer[] domesticImagesClicked = {
        R.drawable.ic_directions_bus_clicked_24dp,
        R.drawable.ic_flight_takeoff_clicked_24dp,
        R.drawable.ic_directions_boat_clicked_24dp,
        R.drawable.ic_train_clicked_24dp,
        R.drawable.ic_hotel_clicked,
        R.drawable.ic_rent_a_car_clicked
};

activity_result.xml

 <android.support.design.widget.TabLayout
            android:id="@+id/tabLayout"
            android:layout_width="match_parent"
            android:layout_height="100dp"
            android:layout_below="@+id/rl_Detail"
            android:background="#F4E6CA"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:tabBackground="?attr/selectableItemBackgroundBorderless"
            app:tabIndicatorColor="@android:color/transparent"
            app:tabPaddingEnd="15dp"
            app:tabPaddingStart="15dp">

            <android.support.design.widget.TabItem
                android:id="@+id/tab1"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:saveEnabled="true" />

            <android.support.design.widget.TabItem
                android:layout_width="wrap_content"
                android:layout_height="match_parent" />

            <android.support.design.widget.TabItem
                android:layout_width="wrap_content"
                android:layout_height="match_parent" />

            <android.support.design.widget.TabItem
                android:layout_width="wrap_content"
                android:layout_height="match_parent" />

            <android.support.design.widget.TabItem
                android:layout_width="wrap_content"
                android:layout_height="match_parent" />

            <android.support.design.widget.TabItem
                android:layout_width="wrap_content"
                android:layout_height="wrap_content" />

        </android.support.design.widget.TabLayout>
Ricardo A.
  • 685
  • 2
  • 8
  • 35
AykutBurock
  • 53
  • 7
  • How are you adding the icons? Can you post the code? If you are adding the icons programmatically you probably need to change their size programmatically as well before adding them. – Ricardo A. Apr 11 '19 at 13:21
  • @RicardoAlbuquerque I post in ResultActivity that added icons. I should change size of icons only for tablet screen. I can't change their size for tablets with programmatically right? So, I won't be solution for me. – AykutBurock Apr 11 '19 at 13:25

3 Answers3

2

If you want different icon sizes for different screen sizes you probably need to to any of these:

1 - Make different images with it's own right size and put in the respective folders, as android have drawable folders for each dpi density, take a look at: Android Studio: Drawable Folder: How to put Images for Multiple dpi?

2 - If the icons are simple, you can use vector icons, since they can change their size to fit any screen size you need. Take a look at: https://developer.android.com/studio/write/vector-asset-studio

3 - You can check if the device is an tablet and change the icons size programatically as well, that will depend on how you are adding the icons. You can check that using the following code:

public static boolean isTablet(Context context) { return (context.getResources().getConfiguration().screenLayout & 0xF) >= 3; }

or you can check for different ways of doing that here: Determine if the device is a smartphone or tablet?

If none of those methods helps, there is an official detailed guide: https://developer.android.com/guide/practices/screens_support.html#DeclaringTabletLayouts

Ricardo A.
  • 685
  • 2
  • 8
  • 35
  • 1
    Thank you. I already doing 1st and 2nd. But, 3rd and other one you wrote. It can work for me. I will try. I will sign mark your answer after I solve problem. – AykutBurock Apr 11 '19 at 13:51
0

You can specify different set of resources(drawable folder) for the tablet configeration.

You would be needing another drawable folder named as drawable-sw600dp for tablets.

Like defined in the supporting different screen sizes and alternatice app resources

Another way would be create a custom view for your tabs.

You can create a layout for the custom tab for tablets.

Then inflate the layout programmatically , and set it with tab.setCustomView(customView) .

You can do this only in the case of tablets.

Kaveri
  • 1,060
  • 2
  • 12
  • 21
  • I already did drawable folder. My problem is can't increase icon size. How can I create a custom view? I tried to make item Text Appearance but it didn't work. – AykutBurock Apr 11 '19 at 13:44
0

You can increase the size of icons by using 

    for (int i = 0; i < tabLayout.getTabCount(); i++) {
        TabLayout.Tab tab = tabLayout.getTabAt(i);
        switch(i){
            case 0: if (tab != null){
                        tab.setIcon(R.drawable.your_icon_1)
                        .setText(R.string.your_text1);
                    }break;
            case 1: if (tab != null){
                        tab.setIcon(R.drawable.your_icon_2)
                        .setText(R.string.your_text2);
                    }break;
            case 2: if (tab != null){
                        tab.setIcon(R.drawable.your_icon_3)
                        .setText(R.string.your_text3);
                    }break;
            case 3: if (tab != null){
                        tab.setIcon(R.drawable.your_icon_4)
                        .setText(R.string.your_text4);
                    }break;
        }
        if (tab != null) tab.setCustomView(R.layout.your_custom_view);
    }

create a new layout resource as your_custom_view.xml like this, 

<?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>
Faisal
  • 752
  • 6
  • 9