Jump to content

Fragments, UI adaptative smartphone et tablette


duntown
 Share

Recommended Posts

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. :)

Link to comment
Share on other sites

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
 

 

Link to comment
Share on other sites

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);
}
Edited by Dunexus
Link to comment
Share on other sites

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. :)

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • Create New...