Как выровнять значок с текстом в вкладках TabLayout в Android

Question

Я работаю на экране, который содержит две вкладки. Я использую AppCompatActivity здесь. Я установил значок с текстом на вкладках, но я хочу, чтобы изображение было выровнено по правому краю и между ними должно быть какое-то пространство. Код приведен ниже:

1. Activity_ProfessionalTimeline.java

public class Activity_ProfessionalTimeline extends AppCompatActivity implements OnClickListener { 

    private Toolbar toolbatTop; 
    private TabLayout tabLayout; 
    private ViewPager viewPager; 
    private TabsPagerAdapter mAdapter; 
    private ActionBar actionBar; 

    private int[] tabIcons = { 
      R.drawable.social, 
      R.drawable.professional 
    }; 


    private ImageView _img_Profile; 

    private TextView _txt_UserName; 
    private TextView _txt_UserDestination; 

    ArrayList<Model_LoginDetails> arr_LogInUserDetails = new ArrayList<Model_LoginDetails>(); 

    private ImageView _imt_userImage; 
    private ListView _listView_SelectOpition; 

    private boolean profilebtnstatus = false; 
    private RelativeLayout _relativelayour_status; 
    private ListView _listviewmoroption; 
    private DrawerLayout drawer; 

    @Override 
    protected void onCreate(Bundle savedInstanceState) { 
     super.onCreate(savedInstanceState); 
     setContentView(R.layout.activity_professionalttimeline); 

     // Top Toolbar 
     Toolbar toolbarTop = (Toolbar) findViewById(R.id.toolbar_top); 
     toolbarTop.setTitle("Recent Professional Activities"); 

     LayoutInflater inflator = (LayoutInflater) this 
       .getSystemService(Context.LAYOUT_INFLATER_SERVICE); 
     setSupportActionBar(toolbarTop); 
     getSupportActionBar().setDisplayShowHomeEnabled(true); 
     getSupportActionBar().setHomeButtonEnabled(true); 
     getSupportActionBar().setStackedBackgroundDrawable(new ColorDrawable(Color 
       .parseColor("#fbae38"))); 
     getSupportActionBar().setBackgroundDrawable(new ColorDrawable(Color 
       .parseColor("#2b4d72"))); 
     //getSupportActionBar().setIcon(R.drawable.appicon); 


     View actionBarView = inflator.inflate(R.layout.actionbar_custom_layout, 
       null); 
     ImageView _mProfileImage = (ImageView) actionBarView 
       .findViewById(R.id.img_Profile); 
     /*Picasso.with(Activity_ProfessionalTimeline.this) 
       .load(arr_LogInUserDetails.get(0).getThumbnail_url()) 
       .into(_mProfileImage);*/ 
     LayoutParams layoutParams = new LayoutParams(LayoutParams.MATCH_PARENT, 
       LayoutParams.MATCH_PARENT); 

     getSupportActionBar().setCustomView(actionBarView); 


     drawer = (DrawerLayout) findViewById(R.id.drawer_layout); 

     Bundle bundle = getIntent().getExtras(); 
     arr_LogInUserDetails = bundle.getParcelableArrayList("mylist"); 

     _imt_userImage = (ImageView) findViewById(R.id.imt_userImage); 
     _txt_UserName = (TextView) findViewById(R.id.txt_UserName); 
     _txt_UserDestination = (TextView) findViewById(R.id.txt_Userdestination); 

     _img_Profile = (ImageView) findViewById(R.id.img_Profile); 
     _listviewmoroption = (ListView) findViewById(R.id.listviewmoroption); 
     _listviewmoroption.setAdapter(new Adapter_MenuOpition(
       Activity_ProfessionalTimeline.this)); 
     _listviewmoroption.setOnItemClickListener(new OnItemClickListener() { 

      @Override 
      public void onItemClick(AdapterView<?> arg0, View arg1, int arg2, 
            long arg3) { 
       switch (arg2) { 
        case 0: 
         fun_hidemenu(); 
         Bundle bundle = new Bundle(); 
         Intent int_ProfessionalTimeline = new Intent(
           Activity_ProfessionalTimeline.this, 
           Acitivty_AccountSetting.class); 
         bundle.putParcelableArrayList("mylist", 
           arr_LogInUserDetails); 
         int_ProfessionalTimeline.putExtras(bundle); 
         startActivity(int_ProfessionalTimeline); 
         break; 
        case 1: 

         break; 
        case 2: 
         finish(); 
         break; 

        default: 
         break; 
       } 
      } 
     }); 

     _relativelayour_status = (RelativeLayout) findViewById(R.id.reltv_Menu); 

     _listView_SelectOpition = (ListView) findViewById(R.id.list_allSelection); 
     _listView_SelectOpition.setAdapter(new Adapter_SelectionOpition(
       Activity_ProfessionalTimeline.this)); 
     _listView_SelectOpition 
       .setOnItemClickListener(new OnItemClickListener() { 

        @Override 
        public void onItemClick(AdapterView<?> arg0, View arg1, 
              int arg2, long arg3) { 
         drawer.closeDrawers(); 
         switch (arg2) { 
          case 0: 

           break; 
          case 1: 
           Intent int_Intership = new Intent(Activity_ProfessionalTimeline.this, Tab_InterShip.class); 
           int_Intership.putExtra("image", arr_LogInUserDetails.get(0).getThumbnail_url()); 
           startActivity(int_Intership); 
           break; 

          case 2: 
           Intent int_AddJob = new Intent(Activity_ProfessionalTimeline.this, Tab_AddJob.class); 
           int_AddJob.putExtra("image", arr_LogInUserDetails.get(0).getThumbnail_url()); 
           int_AddJob.putExtra("addjob", "addJob"); 
           startActivity(int_AddJob); 
           break; 

          case 3: 
           Intent int_SearchJob = new Intent(Activity_ProfessionalTimeline.this, Tab_SearchJob.class); 
           int_SearchJob.putExtra("image", arr_LogInUserDetails.get(0).getThumbnail_url()); 
           startActivity(int_SearchJob); 
           break; 

          case 4: 
           Intent int_PostedJob = new Intent(Activity_ProfessionalTimeline.this, Tab_PostedJob.class); 
           int_PostedJob.putExtra("image", arr_LogInUserDetails.get(0).getThumbnail_url()); 
           startActivity(int_PostedJob); 
           break; 

          case 5: 
           Intent int_AppliedJob = new Intent(Activity_ProfessionalTimeline.this, TabFragment_AppliedJob.class); 
           int_AppliedJob.putExtra("image", arr_LogInUserDetails.get(0).getThumbnail_url()); 
           startActivity(int_AppliedJob); 
           break; 

          case 6: 
           Intent int_JobMENTOR = new Intent(Activity_ProfessionalTimeline.this, Tab_JobMentor.class); 
           int_JobMENTOR.putExtra("image", arr_LogInUserDetails.get(0).getThumbnail_url()); 
           startActivity(int_JobMENTOR); 

           break; 

          case 7: 
           Intent int_JobMEtees = new Intent(Activity_ProfessionalTimeline.this, Tab_mentees.class); 
           int_JobMEtees.putExtra("image", arr_LogInUserDetails.get(0).getThumbnail_url()); 
           startActivity(int_JobMEtees); 
           break; 

          case 8: 

           break; 

          case 9: 

           break; 

          case 10: 

           break; 

          default: 
           break; 
         } 
        } 
       }); 

     _img_Profile.setOnClickListener(this); 


     Picasso.with(Activity_ProfessionalTimeline.this) 
       .load(arr_LogInUserDetails.get(0).getThumbnail_url()) 
       .into(_imt_userImage); 
     _txt_UserName.setText(arr_LogInUserDetails.get(0).getUser_Name()); 
     _txt_UserDestination.setText(arr_LogInUserDetails.get(0) 
       .getUser_Skills()); 


     viewPager = (ViewPager) findViewById(R.id.pager); 
     setupViewPager(viewPager); 

     tabLayout = (TabLayout) findViewById(R.id.tab_layout); 
     tabLayout.setupWithViewPager(viewPager); 

     //----Call this function for displaying image in tab 
     setupTabIcons(); 
    } 

    private void setupTabIcons() { 
     tabLayout.getTabAt(0).setIcon(tabIcons[0]); 
     tabLayout.getTabAt(1).setIcon(tabIcons[1]); 

    } 

    private void setupViewPager(ViewPager viewPager) { 
     ViewPagerAdapter adapter = new ViewPagerAdapter(getSupportFragmentManager()); 
     adapter.addFrag(new TabFragment_Social(Activity_ProfessionalTimeline.this, arr_LogInUserDetails), "Social"); 
     adapter.addFrag(new TabFragment_Professional(), "Professional"); 

     viewPager.setAdapter(adapter); 
    } 

    class ViewPagerAdapter extends FragmentPagerAdapter { 
     private final List<Fragment> mFragmentList = new ArrayList<>(); 
     private final List<String> mFragmentTitleList = new ArrayList<>(); 

     public ViewPagerAdapter(FragmentManager manager) { 
      super(manager); 
     } 

     @Override 
     public Fragment getItem(int position) { 
      return mFragmentList.get(position); 
     } 

     @Override 
     public int getCount() { 
      return mFragmentList.size(); 
     } 

     public void addFrag(Fragment fragment, String title) { 
      mFragmentList.add(fragment); 
      mFragmentTitleList.add(title); 
     } 

     @Override 
     public CharSequence getPageTitle(int position) { 
      return mFragmentTitleList.get(position); 
     } 
    } 


    @Override 
    public void onClick(View arg0) { 
     switch (arg0.getId()) { 
      case R.id.img_Profile: 
       if (profilebtnstatus == false) { 
        _relativelayour_status.setVisibility(View.VISIBLE); 
        _img_Profile.setBackgroundColor(Color.parseColor("#faad38")); 
        profilebtnstatus = true; 
       } else { 
        fun_hidemenu(); 
       } 
       break; 

      default: 
       break; 
     } 
    } 

    private void fun_hidemenu() { 
     if (profilebtnstatus == true) { 
      _relativelayour_status.setVisibility(View.GONE); 
      _img_Profile.setBackgroundColor(Color.parseColor("#2b4d72")); 
      profilebtnstatus = false; 
     } 

    } 

} 

2.activity_professionaltimeline.xml

<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android" 
xmlns:app="http://schemas.android.com/apk/res-auto" 
android:id="@+id/drawer_layout" 
android:layout_width="match_parent" 
android:layout_height="match_parent"> 

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent"> 

    <!--Top Toolbar--> 
    <android.support.v7.widget.Toolbar 
     android:id="@+id/toolbar_top" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_alignParentTop="true" 
     android:background="#3f5e7e" 
     android:elevation="6dp" 
     android:minHeight="?attr/actionBarSize" 
     android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" 
     app:popupTheme="@style/ThemeOverlay.AppCompat.Light" /> 

    <android.support.design.widget.TabLayout 
     android:id="@+id/tab_layout" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_below="@+id/toolbar_top" 
     android:background="#fbae38" 
     android:elevation="6dp" 
     android:minHeight="?attr/actionBarSize" 
     android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" 
     app:tabGravity="fill" 
     app:tabMode="fixed"/> 


    <android.support.v4.view.ViewPager 
     android:id="@+id/pager" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:layout_above="@+id/reltv_footer"></android.support.v4.view.ViewPager> 

    <RelativeLayout 
     android:id="@+id/reltv_footer" 
     android:layout_width="match_parent" 
     android:layout_height="50sp" 
     android:layout_alignParentBottom="true" 
     android:background="#2b4d72"> 

     <LinearLayout 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_alignParentRight="true" 
      android:layout_centerVertical="true" 
      android:padding="20sp" /> 

     <ImageView 
      android:id="@+id/img_Profile" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_alignParentRight="true" 
      android:layout_centerVertical="true" 
      android:background="#2b4d72" 
      android:padding="15sp" 
      android:src="@drawable/more_option" /> 

     <View 
      android:id="@+id/img_view" 
      android:layout_width="3sp" 
      android:layout_height="fill_parent" 
      android:layout_toLeftOf="@+id/img_Profile" 
      android:background="#335980" /> 

     <LinearLayout 
      android:layout_width="fill_parent" 
      android:layout_height="fill_parent" 
      android:layout_toLeftOf="@+id/img_view" 
      android:background="#2b4d72" 
      android:gravity="left" 
      android:orientation="horizontal"> 

      <ImageView 
       android:id="@+id/home" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:layout_alignParentRight="true" 
       android:layout_centerVertical="true" 
       android:background="#203b58" 
       android:padding="15sp" 
       android:src="@drawable/home" /> 

      <View 
       android:layout_width="2sp" 
       android:layout_height="fill_parent" 
       android:layout_toLeftOf="@+id/img_Profile" 
       android:background="#203b58" /> 

      <ImageView 
       android:id="@+id/friendrequest" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:layout_alignParentRight="true" 
       android:layout_centerVertical="true" 
       android:padding="15sp" 
       android:src="@drawable/friend_req" /> 

      <View 
       android:layout_width="2sp" 
       android:layout_height="fill_parent" 
       android:layout_toLeftOf="@+id/img_Profile" 
       android:background="#203b58" /> 

      <ImageView 
       android:id="@+id/message" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:layout_alignParentRight="true" 
       android:layout_centerVertical="true" 
       android:padding="15sp" 
       android:src="@drawable/meg" /> 

      <View 
       android:layout_width="2sp" 
       android:layout_height="fill_parent" 
       android:layout_toLeftOf="@+id/img_Profile" 
       android:background="#203b58" /> 

      <ImageView 
       android:id="@+id/notification" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:layout_alignParentRight="true" 
       android:layout_centerVertical="true" 
       android:padding="15sp" 
       android:src="@drawable/footer_notification" /> 
     </LinearLayout> 
    </RelativeLayout> 

    <RelativeLayout 
     android:id="@+id/reltv_Menu" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_above="@+id/reltv_footer" 
     android:layout_alignParentRight="true" 
     android:background="#ffffff" 
     android:visibility="gone"> 

     <ListView 
      android:id="@+id/listviewmoroption" 
      android:layout_width="200sp" 
      android:layout_height="wrap_content" 
      android:divider="#6d6d6d" 
      android:dividerHeight="1sp"></ListView> 
    </RelativeLayout> 
</RelativeLayout> 

<FrameLayout 
    android:id="@+id/content_frame" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" /> 

<LinearLayout 
    android:id="@+id/left_drawer" 
    android:layout_width="wrap_content" 
    android:layout_height="match_parent" 
    android:layout_gravity="right" 
    android:background="@android:color/white" 
    android:choiceMode="singleChoice" 
    android:orientation="vertical"> 

    <include layout="@layout/cust_rightnavigationdrawer" /> 
</LinearLayout> 

3. ScreenShot

Пожалуйста, расскажите, как указать расстояние между значком и текстом.

Answer 1

Вы можете сделать простой макет с изображением и текстом, а затем можете установить этот макет на свою вкладку, например, таким образом, что я сделал.

tabLayout = (TabLayout) findViewById(R.id.main_fragment_tab); 
tabLayout.addTab(tabLayout.newTab()); 
tabLayout.addTab(tabLayout.newTab()); 
tabLayout.getTabAt(0).setCustomView(R.layout.custom_tab_title); 
tabLayout.getTabAt(1).setCustomView(R.layout.custom_tab_title); 
View tab1_view = tabLayout.getTabAt(0).getCustomView(); 
View tab2_view = tabLayout.getTabAt(1).getCustomView(); 
TextView tab1_title = (TextView) tab1_view.findViewById(R.id.tv_tab_title); 
ImageView img1 = (ImageView) tab1_view.findViewById(R.id.img); 
TextView tab2_title = (TextView) tab2_view.findViewById(R.id.tv_tab_title); 
ImageView img2 = (ImageView) tab2_view.findViewById(R.id.img); 
tab1_title.setText("Tab1"); 
img1.setImageResource(R.drawable.sample_image); 
tab2_title.setText("Tab2"); 
img2.setImageResource(R.drawable.sample_image);