Ajouter une image sur 3 onglets

Comment puis-je ajouter des images dans l'onglet ? Actuellement, je suis en mesure de déplacer l'onglet vers le bas, mais n'ont aucune idée de comment modifier la LL Tab1, LL Tab2, LL Tab3 de l'icône.Suis-je sur le bon chemin ? Toute aide serait grandement appréciée.

code xml

<?xml version="1.0" encoding="utf-8"?>
<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/tabhost"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="vertical"
        android:padding="5dp" >


        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:padding="5dp"
            android:layout_weight="1" >

            <LinearLayout
                android:id="@+id/ll_tab1"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:orientation="vertical" />

            <LinearLayout
                android:id="@+id/ll_tab2"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:orientation="vertical" />

            <LinearLayout
                android:id="@+id/ll_tab3"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:orientation="vertical" />
        </FrameLayout>
        <TabWidget
            android:id="@android:id/tabs"
            android:background="@color/light_gray"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_weight="0"/>
    </LinearLayout>

</TabHost>

Quelqu'un peut aider? Merci beaucoup !

InformationsquelleAutor John Joe | 2016-03-07

9

Essayez d'utiliser TabLayout de Android Support À La Conception De La Bibliothèque pour répondre à matériel des lignes directrices de conception pour les onglets.

La Conception de la bibliothèque TabLayout implémente à la fois fixe onglets, où l'
vue la largeur est divisée en parts égales entre tous les onglets, ainsi que
défilement des onglets, où les languettes ne sont pas d'une taille uniforme et pouvez faire défiler
horizontalement.

À mettre en œuvre TabLayout cochez cette guide et comment faire pour ajouter l'icône de swipeable onglets pour définir des icônes à onglets à l'aide de setIcon.
```
final int[] ICONS = new int[]{
        R.drawable.ic_action_document,
        R.drawable.ic_action_tick,
        R.drawable.ic_action_trash};
        ....
TabLayout tabLayout = (TabLayout) findViewById(R.id.tabs);
tabLayout.setupWithViewPager(mViewPager);

tabLayout.getTabAt(0).setIcon(ICONS[0]);
tabLayout.getTabAt(1).setIcon(ICONS[1]);
tabLayout.getTabAt(2).setIcon(ICONS[2]);
```
Pour définir les onglets en bas dans un TabLayout check - Comment puis-je configurer les onglets en bas et aussi masquer les haut actionbar? où vous avez mis le TabLayout dans un relativeLayout et d'aligner parent bas:
```
<android.support.design.widget.TabLayout
    android:id="@+id/tab_layout"
    app:tabMode="fixed"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="?attr/colorPrimary"
    android:elevation="6dp"
    app:tabTextColor="#d3d3d3"
    app:tabSelectedTextColor="#ffffff"
    app:tabIndicatorColor="#ff00ff"
    android:minHeight="?attr/actionBarSize"
    android:layout_alignParentBottom="true"
    />
```
Bien que vous pouvez mettre votre onglet mise en page, en bas, essayez de ne pas utiliser de fond de l'onglet barres, si possible, comme par le Pur Android guide.

Autres plates-formes utilisent la barre du bas pour basculer entre l'application de la
les vues. Par la plate-forme de convention, Android onglets pour afficher de contrôle sont
indiqué dans la barre d'action en haut de l'écran à la place.

InformationsquelleAutor random

import android.os.Bundle;
import android.support.design.widget.TabLayout;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import java.util.ArrayList;
import java.util.List;
public class MainActivity extends AppCompatActivity {
private Toolbar toolbar;
private TabLayout tabLayout;
private ViewPager viewPager;
private int[] tabIcons = {
R.drawable.ic_tab_favourite,
R.drawable.ic_tab_call,
R.drawable.ic_tab_contacts
};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
viewPager = (ViewPager) findViewById(R.id.viewpager);
setupViewPager(viewPager);
tabLayout = (TabLayout) findViewById(R.id.tabs);
tabLayout.setupWithViewPager(viewPager);
setupTabIcons();
}
private void setupTabIcons() {
tabLayout.getTabAt(0).setIcon(tabIcons[0]);
tabLayout.getTabAt(1).setIcon(tabIcons[1]);
tabLayout.getTabAt(2).setIcon(tabIcons[2]);
}
private void setupViewPager(ViewPager viewPager) {
ViewPagerAdapter adapter = new ViewPagerAdapter(getSupportFragmentManager());
adapter.addFragment(new OneFragment(), "ONE");
adapter.addFragment(new TwoFragment(), "TWO");
adapter.addFragment(new ThreeFragment(), "THREE");
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 addFragment(Fragment fragment, String title) {
mFragmentList.add(fragment);
mFragmentTitleList.add(title);
}
@Override
public CharSequence getPageTitle(int position) {
return mFragmentTitleList.get(position);
}
}
}

Mise en page de l'Onglet
activity_main.xml

<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />
<android.support.design.widget.TabLayout
android:id="@+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabMode="fixed"
app:tabGravity="fill"/>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="@+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior"  />
</android.support.design.widget.CoordinatorLayout>

Fragments(de Classe) utilisé dans cet onglet

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
public class OneFragment extends Fragment{
public OneFragment() {
//Required empty public constructor
}
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
//Inflate the layout for this fragment
return inflater.inflate(R.layout.fragment_one, container, false);
}
}

Fichier Xml
fragment_one.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".fragments.OneFragment">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/one"
android:textSize="40dp"
android:textStyle="bold"
android:layout_centerInParent="true"/>
</RelativeLayout>

TwoFragment.java

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
public class TwoFragment extends Fragment{
public TwoFragment() {
//Required empty public constructor
}
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
//Inflate the layout for this fragment
return inflater.inflate(R.layout.fragment_two, container, false);
}
}

fragment_two.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".fragments.TwoFragment">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/one"
android:textSize="40dp"
android:textStyle="bold"
android:layout_centerInParent="true"/>
</RelativeLayout>

Vous pouvez créer un troisième fragment de la classe, et la mise en page comme je l'ai fait ci-dessus.

L'exécuter. Espérons que cela fonctionnerait

InformationsquelleAutor Visal Varghese

Essayer cela,

puth ce activity_main.xml et de définir la hauteur personnalisée à TabLayout.

<android.support.design.widget.TabLayout
android:id="@+id/tabs"
android:layout_width="match_parent"
android:layout_height="@dimen/custom_tab_layout_height"
app:tabMode="fixed"
app:tabGravity="fill"/>

Créer une mise en page xml nommé custom_tab.xml en vertu de la res ⇒ mise en page. Dans cette présentation, nous avons défini la vue personnalisée pour l'onglet.

<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/tab"
android:textColor="@color/colorAccent"
android:textSize="@dimen/tab_label"
android:fontFamily="@string/font_fontFamily_medium"/>

Ouvrir MainActivity.java et modifiez le code comme ci-dessous. Ici, si vous observez setupTabIcons() la méthode, j'ai rendu custom_tab.xml mise en page dans chaque onglet ci-dessous à l'aide de lignes de code.

TextView tabOne = (TextView) LayoutInflater.from(this).inflate(R.layout.custom_tab, null);
tabOne.setText("ONE");
tabOne.setCompoundDrawablesWithIntrinsicBounds(0, R.drawable.ic_tab_favourite, 0, 0);
tabLayout.getTabAt(0).setCustomView(tabOne);
TextView tabTwo = (TextView) LayoutInflater.from(this).inflate(R.layout.custom_tab, null);
tabTwo.setText("TWO");
tabTwo.setCompoundDrawablesWithIntrinsicBounds(0, R.drawable.ic_tab_call, 0, 0);
tabLayout.getTabAt(1).setCustomView(tabTwo);
TextView tabThree = (TextView) LayoutInflater.from(this).inflate(R.layout.custom_tab, null);
tabThree.setText("THREE");
tabThree.setCompoundDrawablesWithIntrinsicBounds(0, R.drawable.ic_tab_contacts, 0, 0);
tabLayout.getTabAt(2).setCustomView(tabThree);

InformationsquelleAutor Pradeep Gupta

1

Essayer,Vraiment intéressant.Doit être la solution

http://www.androidhive.info/2015/09/android-material-design-working-with-tabs/

InformationsquelleAutor thilinawarne
-1

Eh bien, vous pouvez soit placer un ImageView dans votre Linearlayout qui est chaque onglet, ou vous pouvez définir un drawable comme arrière-plan pour votre LinearLayout. Si votre image s'agir d'un arrière-plan alors vous aurez évidemment voulez ajouter cette image comme arrière-plan et de ne pas ajouter une ImageView comme un enfant à votre LinearLayout. Si il est va être le contenu, pas l'arrière-plan, vous devez ajouter une ImageView à chaque LinearLayout comme vous le feriez pour ajouter un enfant de tout autre type d'une Vue parent.
- J'ai défini un drawable comme arrière-plan pour LinearLayout mais l'image ne montre pas
InformationsquelleAutor Devsil

Vous devez vous connecter pour publier un commentaire.