Xamarin: widget Android

Date picker

Questo è un widget utilizzato per visualizzare la data. In questo esempio, creeremo un selettore di date che mostra la data impostata su una visualizzazione di testo.

Prima di tutto, crea un nuovo progetto e chiamalo datePickerExample. ApertoMain.axml e crea un file datepicker, textviewe a button.

<?xml version = "1.0" encoding = "utf-8"?> 
<LinearLayout xmlns:android = "http://schemas.android.com/apk/res/android" 
   android:orientation = "vertical" 
   android:layout_width = "fill_parent" 
   android:layout_height = "fill_parent"> 
   <DatePicker 
      android:layout_width = "match_parent" 
      android:layout_height = "wrap_content" 
      android:id = "@+id/datePicker1" /> 
   <TextView 
      android:text = "Current Date" 
      android:textAppearance = "?android:attr/textAppearanceLarge" 
      android:layout_width = "match_parent" 
      android:layout_height = "wrap_content" 
      android:id = "@+id/txtShowDate" /> 
   <Button 
      android:text = "Select Date" 
      android:layout_width = "match_parent" 
      android:layout_height = "wrap_content" 
      android:id = "@+id/btnSetDate" /> 
</LinearLayout>

Quindi, vai a Mainactivity.cs. Per prima cosa creiamo un'istanza privata di una visualizzazione di testo all'interno dimainActivity:Activity classe.

L'istanza verrà utilizzata per memorizzare la data selezionata o la data predefinita.

private TextView showCurrentDate;

Successivamente, aggiungi il codice seguente dopo setContentView() metodo.

DatePicker pickDate = FindViewById<DatePicker>(Resource.Id.datePicker1); 
showCurrentDate = FindViewById<TextView>(Resource.Id.txtShowDate); 
setCurrentDate(); 
Button button = FindViewById<Button>(Resource.Id.btnSetDate); 
button.Click += delegate { 
   showCurrentDate.Text = String.Format("{0}/{1}/{2}", 
      pickDate.Month, pickDate.DayOfMonth, pickDate.Year); 
};

Nel codice sopra, abbiamo fatto riferimento al nostro datepicker, textview e pulsante trovandoli dal nostro main.axml file utilizzando FindViewById classe.

Dopo aver fatto riferimento, impostiamo l'evento clic sul pulsante che è responsabile del passaggio della data selezionata dal selettore di date alla visualizzazione di testo.

Successivamente, creiamo il file setCurrentDate()metodo per visualizzare la data corrente predefinita nella nostra vista di testo. Il codice seguente spiega come è fatto.

private void setCurrentDate() { 
   string TodaysDate = string.Format("{0}", 
      DateTime.Now.ToString("M/d/yyyy").PadLeft(2, '0')); 
   showCurrentDate.Text = TodaysDate; 
}

DateTime.Now.ToString() class lega l'ora odierna a un oggetto stringa.

Ora, crea ed esegui l'app. Dovrebbe visualizzare il seguente output:

Time Picker

Time Picker è un widget utilizzato per visualizzare l'ora oltre a consentire a un utente di scegliere e impostare l'ora. Creeremo un'app di selezione dell'ora di base che mostra l'ora e consente inoltre a un utente di modificare l'ora.

Vai a main.axml e aggiungi un nuovo pulsante, una visualizzazione di testo e un selettore dell'ora come mostrato nel codice seguente.

<?xml version = "1.0" encoding = "utf-8"?> 
<LinearLayout xmlns:android = "http://schemas.android.com/apk/res/android" 
   android:orientation = "vertical" 
   android:background = "#d3d3d3" 
   android:layout_width = "fill_parent" 
   android:layout_height = "fill_parent"> 
   <TimePicker 
      android:layout_width = "match_parent" 
      android:layout_height = "wrap_content" 
      android:id = "@+id/timePicker1" /> 
   <TextView
      android:text = "Time" 
      android:textAppearance = "?android:attr/textAppearanceLarge" 
      android:layout_width = "match_parent" 
      android:layout_height = "wrap_content" 
      android:id = "@+id/txt_showTime" 
      android:textColor = "@android:color/black" /> 
   <Button 
      android:text = "Set Time" 
      android:layout_width = "200dp" 
      android:layout_height = "wrap_content" 
      android:id = "@+id/btnSetTime" 
      android:textColor = "@android:color/black" 
      android:background = "@android:color/holo_green_dark" /> 
</LinearLayout>

Vai a MainActivity.cs per aggiungere la funzionalità per visualizzare una data impostata sulla visualizzazione di testo che abbiamo creato.

public class MainActivity : Activity { 
   
   private TextView showCurrentTime; 
   
   protected override void OnCreate(Bundle bundle) { 
      
      base.OnCreate(bundle); 
      SetContentView(Resource.Layout.Main); 
      TimePicker Tpicker = FindViewById<TimePicker>(Resource.Id.timePicker1); 
      showCurrentTime = FindViewById<TextView>(Resource.Id.txt_showTime); 
      setCurrentTime(); 
      Button button = FindViewById<Button>(Resource.Id.btnSetTime); 
      
      button.Click += delegate { 
         showCurrentTime.Text = String.Format("{0}:{1}", 
            Tpicker.CurrentHour, Tpicker.CurrentMinute); 
      }; 
   } 
   private void setCurrentTime() { 
      string time = string.Format("{0}", 
         DateTime.Now.ToString("HH:mm").PadLeft(2, '0')); 
      showCurrentTime.Text = time;
   } 
}

Nel codice sopra, abbiamo prima fatto riferimento a timepicker,set time pulsante e la vista di testo per mostrare l'ora attraverso il FindViewById<>classe. Abbiamo quindi creato un evento clic per il pulsante di impostazione dell'ora che al clic imposta l'ora sull'ora selezionata da una persona. Per impostazione predefinita, mostra l'ora di sistema corrente.

Il setCurrentTime() la classe del metodo inizializza il file txt_showTime textview per visualizzare l'ora corrente.

Ora, crea ed esegui la tua applicazione. Dovrebbe visualizzare il seguente output:

Spinner

Uno spinner è un widget utilizzato per selezionare un'opzione da un set. È l'equivalente di una casella a discesa / combinata. Prima di tutto, crea un nuovo progetto e chiamaloSpinner App Tutorial.

Aperto Main.axml sotto il layout folder e creane uno nuovo spinner.

<?xml version = "1.0" encoding = "utf-8"?> 
<LinearLayout xmlns:android = "http://schemas.android.com/apk/res/android" 
   android:orientation = "vertical" 
   android:layout_width = "fill_parent" 
   android:layout_height = "fill_parent"> 
   <Spinner 
      android:layout_width = "match_parent"
      android:layout_height = "wrap_content" 
      android:id = "@+id/spinner1" 
      android:prompt = "@string/daysOfWeek" /> 
</LinearLayout>

Aperto Strings.xml file che si trova sotto values folder e aggiungi il codice seguente per creare il file spinner items.

<resources> 
  <string name = "daysOfWeek">Choose a planet</string> 
  <string-array name = "days_array"> 
      <item>Sunday</item> 
      <item>Monday</item> 
      <item>Tuesday</item> 
      <item>Wednesday</item> 
      <item>Thursday</item> 
      <item>Friday</item> 
      <item>Saturday</item> 
      <item>Sunday</item> 
   </string-array> 
</resources>

Quindi apri MainActivity.cs per aggiungere la funzionalità per visualizzare il giorno della settimana selezionato.

protected override void OnCreate(Bundle bundle) { 
   base.OnCreate(bundle);  
   // Set our view from the "main" layout resource 
   SetContentView(Resource.Layout.Main); 
   Spinner spinnerDays = FindViewById<Spinner>(Resource.Id.spinner1); 
   spinnerDays.ItemSelected += new EventHandler
      <AdapterView.ItemSelectedEventArgs>(SelectedDay); 
   var adapter = ArrayAdapter.CreateFromResource(this, 
      Resource.Array.days_array, Android.Resource.Layout.SimpleSpinnerItem);  
   adapter.SetDropDownViewResource(Android.Resource.Layout.SimpleSpinnerDropD ownItem); 
   spinnerDays.Adapter = adapter; 
}  
private void SelectedDay(object sender, AdapterView.ItemSelectedEventArgs e) { 
   Spinner spinner = (Spinner)sender; 
   string toast = string.Format("The selected 
      day is {0}", spinner.GetItemAtPosition(e.Position)); 
   Toast.MakeText(this, toast, ToastLength.Long).Show(); 
}

Ora, crea ed esegui l'applicazione. Dovrebbe visualizzare il seguente output:

Nel codice sopra, abbiamo fatto riferimento allo spinner che abbiamo creato nel nostro main.axml file tramite il FindViewById<>classe. Abbiamo quindi creato un nuovo filearrayAdapter() che abbiamo usato per associare i nostri elementi dell'array dal file strings.xml classe.

Infine abbiamo creato il metodo SelectedDay() che abbiamo utilizzato per visualizzare il giorno della settimana selezionato.