2013-09-25 6 views
11

Sto facendo un'attività nella mia app per visualizzare una serie di dati, in particolare luoghi. Ci sarà il nome del luogo, la distanza dall'utilizzatore e un'immagine da seguire. Tutta questa parte che ho ordinato.Uso di ListView o GridView in modo dinamico in base al layout utilizzato dal dispositivo

Desidero visualizzare queste informazioni in modo diverso su dispositivi diversi. Ad un dispositivo più piccolo, ad es. telefono voglio che vengano visualizzati in un elenco di 1 colonne, immagine a sinistra, e il nome e la distanza sulla destra. Ho già impostato questo utilizzando uno ListView.

Tuttavia, su un tablet più grande mi piacerebbe visualizzarlo in una griglia, con l'immagine che rappresenta l'intera cella (quadrato) e il testo sopra l'immagine.

Quale sarebbe l'approccio migliore a questo. Sarebbe 2 layout, uno ListView e uno GridView, e come verrà rilevato il file Activity.java che è presente e formattare i dati di conseguenza? O potrei semplicemente usare uno GridView e impostare dinamicamente le colonne in base alle dimensioni dello schermo?

+0

se visualizzi una galleria di immagini tutte come vorrei andare con la griglia ma dal momento che è una raccolta di date, penso che la lista farà il trucco –

+2

Usa le cartelle: layout per il layout del telefono-xlarge per il tablet. Usa lo stesso nome di layout in entrambe le cartelle e Android scegli quello buono;) –

+0

Esempio completo aggiunto alla mia risposta per il tuo futuro riferimento. – SBerg413

risposta

29

ListView & GridView sono entrambi discendenti di AbsListView. Quindi, nel codice, fare riferimento a un'istanza di AbsListView. Quindi, come suggerito da qualcun altro, utilizza le cartelle di layout specifiche per definire i tuoi layout. Definirai inoltre l'istanza specifica di AbsListView all'interno di questi layout (ListView o GridView).

Se si definisce correttamente i layout con tutti gli stessi nomi degli elementi, il codice non sarà necessario modificare.

EDIT: Non sono sicuro del perché si dovrebbe mai scrivere codice per fare qualcosa che l'SDK/OS farà per voi. Quindi, per gli altri che incappano in questo, ho voluto dare un esempio completo di come farlo senza dover inserire un codice nel tuo codice:

Il progetto completo di base può essere trovato sul mio gitHub qui: https://github.com/sberg413/abslistview-example

Il MainActivity.java:

package com.example.abslistviewexample; 

import android.app.Activity; 
import android.content.Context; 
import android.os.Bundle; 
import android.view.LayoutInflater; 
import android.view.View; 
import android.view.ViewGroup; 
import android.widget.AbsListView; 
import android.widget.ArrayAdapter; 
import android.widget.ImageView; 
import android.widget.TextView;  

public class MainActivity extends Activity { 

     AbsListView absListView; 

     static String[] listItems = { "First Item", "Second Item", "Third Item", 
       "Fourth Item", "Fifth Item", "Sixth Item", "Seventh Item", 
       "Eight Item", "Ninth Item", "Tenth Item" }; 

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

      absListView = (AbsListView) findViewById(R.id.listView1); 

      absListView.setAdapter(new MyArrayAdapter(this, R.layout.row, listItems)); 
     } 


     private class MyArrayAdapter extends ArrayAdapter<String>{ 

      public MyArrayAdapter(Context context, int resource, 
        String[] values) { 
       super(context, resource, values); 
      } 

      @Override 
      public View getView(int position, View convertView, ViewGroup parent) { 
       LayoutInflater inflater = (LayoutInflater) getContext() 
         .getSystemService(Context.LAYOUT_INFLATER_SERVICE); 
       View view = inflater.inflate(R.layout.row, parent, false); 
       TextView textView = (TextView) view.findViewById(R.id.textView1); 
       ImageView imageView = (ImageView) view.findViewById(R.id.imageView1); 

       textView.setText(getItem(position)); 

       return view; 
      } 
     } 
} 

Il layout/activity_main.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=".MainActivity" > 

    <ListView 
     android:id="@+id/listView1" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:layout_alignParentLeft="true" 
     android:layout_alignParentTop="true" > 

    </ListView> 
</RelativeLayout> 

Il layout/row.xml:

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" > 

    <ImageView 
     android:id="@+id/imageView1" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_alignParentLeft="true" 
     android:layout_alignParentTop="true" 
     android:layout_marginLeft="10dp" 
     android:layout_marginTop="10dp" 
     android:src="@drawable/ic_launcher" /> 

    <TextView 
     android:id="@+id/textView1" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_alignTop="@+id/imageView1" 
     android:layout_marginLeft="50dp" 
     android:layout_toRightOf="@+id/imageView1" 
     android:text="TextView" /> 
</RelativeLayout> 

Il layout-xlarge/activity_main.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=".MainActivity" > 

    <GridView 
     android:id="@+id/listView1" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:layout_alignParentTop="true" 
     android:layout_alignParentLeft="true" 
     android:numColumns="3" > 

    </GridView> 
</RelativeLayout> 

Il layout-xlarge/row.xml:

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" > 

    <ImageView 
     android:id="@+id/imageView1" 
     android:layout_width="100dp" 
     android:layout_height="100dp" 
     android:layout_alignParentLeft="true" 
     android:layout_alignParentTop="true" 
     android:layout_marginLeft="10dp" 
     android:layout_marginTop="10dp" 
     android:src="@drawable/ic_launcher" /> 

    <TextView 
     android:id="@+id/textView1" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_marginLeft="20dp" 
     android:layout_marginTop="20dp" 
     android:text="TextView" /> 
</RelativeLayout> 

Si tratta ovviamente di un esempio molto banale, ma si' Avremo l'idea. Si noti come MainActivity utilizza AbsListView. All'interno del layout xmls si specifica quale classe figlio viene utilizzata.

Spero che questo aiuti qualcuno.

+0

questa è la strada da percorrere. mostra la risposta selezionata. –

+0

che ha aiutato molto ... – Rafay

7

Quello che stai facendo è il modo perfetto. Do GridView per scheda da 7 pollici e 10 pollici e per lista di visualizzazione resto. Utilizzare due file di layout diversi e sotto il codice per rilevare il dispositivo se tablet da 7 pollici o tablet da 10 pollici o altro.

public static Double getDiagonalInch(Activity activity) 

{ 

    DisplayMetrics metrics = new DisplayMetrics(); 

    WindowManager wm = (WindowManager) activity.getSystemService(
      Context.WINDOW_SERVICE); 
    wm.getDefaultDisplay().getMetrics(metrics); 
     final int measuredwidth = metrics.widthPixels; 
     final int measuredheight = metrics.heightPixels; 

     final double diagonal = Math.sqrt((measuredwidth * measuredwidth) 
     + (measuredheight * measuredheight)); 


     diaInch = diagonal/metrics.densityDpi; 

    return diaInch; 

} 
if(diaInch<9 && diaInch>=6.5) 
     { 
      // small tab (7 inch tab) 
     } 
     else if(diaInch>9) 
     { 
      // big tab (10 inch tab) 
     } 
     else 
     { 
      s2,s3 s4 etc devices 
     } 
+0

Buono a sapersi, ero sulla linea giusta :). Grazie per questo codice sarà molto utile. –

+0

Sei il benvenuto Tom Hart ... :-) –

Problemi correlati