Fragments, UI adaptative smartphone et tablette

[duntown]

Bonjours à tous,

 

Je cherches actuellement à adapter l'UI de mon application pour les tablettes.

J'ai deux fragments qu'on appellera fragment A et fragment B.

 

Sur smartphone, les deux fragments sont assemblé sur un ViewPager avec onglets.

Sur tablette, il me suffirait de mettre mes deux fragments cotes à cotes dans le layout.

Le truc c'est que la mise en place du ViewPager par un adaptateur et des onglets se fait dans la partie Java et non dans les xml, du coup même sur tablette, cette partie de code sera effectuée.

J'aimerais savoir comment faire, soit en passant uniquement par du xml côté smartphone ou bien en réservant la partie de code pour les smartphones aux smartphones.

J'espère avoir bien étalé mon problème, mon problème est assez général donc je n'ai pas copier mon code mais si vous en avez besoin pour m'aider, n'hésitez pas à demander. :)

[Ice]

Tu peux utiliser la diagonale de l'écran, pour la calculer tu peux faire de la manière suivante :

DisplayMetrics metrics = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(metrics);
double diagonale = Math.sqrt((metrics.widthPixels * metrics.widthPixels) + (metrics.heightPixels * metrics.heightPixels)) / metrics.densityDpi;
if (diagonale > TABLET_SIZE){
        /*Code pour tablettes*/
}
else{
        /*Code pour smartphones*/
}

Ensuite à toi de définir une TABLET_SIZE, 6 ou 7 par exemple.

 

Quelques résultats : 

 

And here are some of stats you get:

Samsung Nexus:  10-23 20:54:16.598: D/Enter(14861): Width: 1196 Height: 720 DPI: 320 Density: 2.0

Droid:  10-24 07:12:42.436: D/Enter(1823):  Width: 854  Height: 480 DPI: 240 Density: 1.5

Nexus 7:  10-23 20:55:06.405: D/Enter(15663): Width: 1280 Height: 736 DPI: 213 Density: 1.33125

Samsung 10.1  10-23 21:10:49.180: D/Enter(3263):  Width: 1280 Height: 752 DPI: 160 Density: 1.0

 

 

These equate to the following:

Galaxy Nexus = 4.3

Droid = 4.08

Nexus 7 = 6.9

Samsug 10.1 = 9.2

 

Tu peux retrouver le post original sur : https://groups.google.com/forum/#!topic/android-developers/1jI9gfIm-T8

 

[duntown]

Merci, je testerais ça.

 

Si quelqu'un à d'autres idée, notamment s'il était possible de passer uniquement par du xml, n'hésitez pas, je suis preneur. ^_^

J'ai fait ça d'une autre manière se basant plus sur le xml retourné que sur une taille fixe d'écran permettant plus de flexibilté.

 

En gros, mon layout pour smartphone met en place le Viewpager qui contiendra les deux fragments :

<android.support.v4.view.ViewPager
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/pager"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.v4.view.PagerTitleStrip
        android:id="@+id/pager_title_strip"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="top"
        android:background="#33b5e5"
        android:textColor="#fff"
        android:paddingTop="4dp"
        android:paddingBottom="4dp" />

</android.support.v4.view.ViewPager>

Tandis que pour tablette, je met directement mes fragments :

<LinearLayout xmlns:android="[url=http://schemas.android.com/apk/res/android]http://schemas.android.com/apk/res/android[/url]"
    android:id="@+id/pager"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >
 
    <fragment
        android:id="@+id/home"
        android:name="com.dunexus.test.fragment_A"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />
 
    <fragment
        android:id="@+id/historique"
        android:name="com.dunexus.test.fragment_B"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />
 
</LinearLayout>

Enfin, pour ajouter mes fragments uniquement si je suis sur smartphone, je vérifie si mes fragments sont déjà là ou non, s'il n'y sont pas, c'est que je suis sur smartphone avec le Viewpager et donc j'y ajoute mes fragments :

setContentView(R.layout.activity_main);
        
View fragment_A = findViewById(R.id.fragment_A);
boolean isTablet = fragment_A != null && fragment_A.getVisibility() == View.VISIBLE;
       		
if(!isTablet){
        PagerAdapter = new PagerAdapter(getSupportFragmentManager());
        mViewPager = (ViewPager) findViewById(R.id.pager);
        mViewPager.setAdapter(PagerAdapter);
}

Modifié 21 août 2013 par Dunexus

[chpil]

@Dunexus: ta façon de faire est la bonne, c'est la manière de faire recommandée, et décrite dans la doc

[duntown]

Oui je m'en suis directement inspiré, le truc c'est qu'au début j'avais pas tout lu et du coup je ne comprenais pas ^_^

Merci quand même à ICE, ça peut servir si on a besoin de déterminer la diagonale de l'appareil. :)