Xamarin - Andriod Views

ListViews

Un Listview è un elemento dell'interfaccia utente che visualizza elenchi di elementi scorrevoli.

Associazione di dati a listviews

In questo esempio, creerai un listView che mostra i giorni della settimana. Per cominciare, creiamo un nuovo file XML e gli diamo un nomelistViewTemplate.xml.

In listViewTemplate.xml, aggiungiamo una nuova visualizzazione di testo come mostrato di seguito.

<?xml version = "1.0" encoding = "utf-8" ?> 
<TextView xmlns:android = "http://schemas.android.com/apk/res/android" 
android:id = "@+id/textItem"  
android:textSize ="20sp" 
android:layout_width = "fill_parent"  
android:layout_height = "wrap_content"/>

Quindi, vai a Main.axml e creare una nuova visualizzazione elenco all'interno del layout lineare.

<ListView 
   android:minWidth="25px" 
   android:minHeight="25px" 
   android:layout_width="match_parent" 
   android:layout_height="match_parent" 
   android:id="@+id/listView1" />

Aperto MainActivity.cse digita il codice seguente per associare i dati al listview che abbiamo creato. Il codice deve essere scritto all'interno del fileOnCreate() metodo.

SetContentView(Resource.Layout.Main); 
var listView = FindViewById<ListView>(Resource.Id.listView1); 
var data = new string[] { 
   "Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday" 
}; 
listView.Adapter = new ArrayAdapter(this, Resource.Layout.ListViewTemplate, data);

Var data = new string[] contiene semplicemente i nostri articoli come un array.

L'adattatore di array restituisce gli elementi della nostra raccolta come vista. Per impostazione predefinita, l'adattatore di array utilizza una textView predefinita per visualizzare ogni elemento. Nel codice sopra, abbiamo creato la nostra visualizzazione del testo inListViewTemplate.xml e vi ha fatto riferimento utilizzando il costruttore mostrato di seguito.

ArrayAdapter(this, Resource.Layout.ListViewTemplate, data);

Infine, crea ed esegui la tua applicazione per visualizzare l'output.

GridViews

Un gridView è un gruppo di visualizzazione che consente alle applicazioni di disporre il contenuto in modo bidimensionale, griglia scorrevole.

Per aggiungere un GridView, crea un nuovo progetto e chiamalo gridViewApp. Vai aMain.axml e aggiungi una griglia come mostrato di seguito.

<?xml version = "1.0" encoding="utf-8"?> 
<GridView xmlns:android = "http://schemas.android.com/apk/res/android" 
   android:id = "@+id/gridview" 
   android:layout_width = "fill_parent" 
   android:layout_height = "fill_parent" 
   android:columnWidth = "90dp" 
   android:numColumns = "auto_fit" 
   android:verticalSpacing = "10dp" 
   android:horizontalSpacing = "10dp" 
   android:stretchMode = "columnWidth" 
   android:gravity = "center" />

Quindi, crea una nuova classe e assegnagli un nome ImageAdpter.cs. Questa classe conterrà le classi dell'adattatore per tutti gli elementi che verranno visualizzati nella griglia.

Dentro ImageAdapter, aggiungi il seguente codice -

public class ImageAdapter : BaseAdapter { 
   Context context; 
   public ImageAdapter(Context ch) {  
      context = ch; 
   } 
      
   public override int Count { 
      get { 
         return cars.Length; 
      } 
   } 
      
   public override long GetItemId(int position) { 
   return 0; 
   } 
      
   public override Java.Lang.Object GetItem(int position) { 
      return null; 
   } 
      
   public override View GetView(int position, 
      View convertView, ViewGroup parent) { 
      ImageView imageView; 
      if (convertView == null) {   
         imageView = new ImageView(context); 
         imageView.LayoutParameters = new GridView.LayoutParams(100, 100); 
         imageView.SetScaleType(ImageView.ScaleType.CenterCrop); 
         imageView.SetPadding(8, 8, 8, 8); 
      } else { 
         imageView = (ImageView)convertView; 
      } 
             
      imageView.SetImageResource(cars[position]); 
      return imageView; 
   } 
   
   int[] cars = { 
      Resource.Drawable.img1, Resource.Drawable.img2, 
      Resource.Drawable.img3, Resource.Drawable.img4, 
      Resource.Drawable.img5, Resource.Drawable.img6, 
   }; 
}

Nel codice sopra, abbiamo semplicemente associato le nostre immagini di auto agli adattatori di immagini. Quindi apriMainActivity.cs e aggiungi il codice seguente dopo setContentView().

var gridview = FindViewById<GridView>(Resource.Id.gridview); 
gridview.Adapter = new ImageAdapter(this); 
gridview.ItemClick += delegate(object sender, 
   AdapterView.ItemClickEventArgs args) { 
      Toast.MakeText(this, 
         args.Position.ToString(), ToastLength.Short).Show(); 
};

Il codice sopra trova il gridView in main.axml e lo lega al file imageAdapter classe. Gridview.ItemClick crea un file onClick evento che restituisce la posizione dell'immagine selezionata quando un utente fa clic su un'immagine.

Ora, crea ed esegui la tua applicazione per visualizzare l'output.