Xamarin - วิดเจ็ต Android

เลือกวันที่

นี่คือวิดเจ็ตที่ใช้แสดงวันที่ ในตัวอย่างนี้เราจะสร้างตัวเลือกวันที่ซึ่งจะแสดงวันที่ที่ตั้งไว้ในมุมมองข้อความ

ก่อนอื่นให้สร้างโครงการใหม่และเรียกมันว่า datePickerExample. เปิดMain.axml และสร้างไฟล์ datepicker, textviewและก 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>

จากนั้นไปที่ Mainactivity.cs. ก่อนอื่นเราสร้างอินสแตนซ์ส่วนตัวของมุมมองข้อความภายในไฟล์mainActivity:Activity ชั้นเรียน

อินสแตนซ์จะถูกใช้เพื่อจัดเก็บวันที่ที่เลือกหรือวันที่เริ่มต้น

private TextView showCurrentDate;

จากนั้นเพิ่มรหัสต่อไปนี้หลัง setContentView() วิธี.

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); 
};

ในโค้ดด้านบนเราได้อ้างอิง datepicker, textview และปุ่มของเราโดยค้นหาจากไฟล์ main.axml ไฟล์โดยใช้ FindViewById ชั้นเรียน

หลังจากอ้างอิงเราตั้งค่าเหตุการณ์การคลิกปุ่มซึ่งรับผิดชอบในการส่งวันที่ที่เลือกจากตัวเลือกวันที่ไปยัง textview

ต่อไปเราจะสร้างไฟล์ setCurrentDate()วิธีการแสดงวันที่ปัจจุบันเริ่มต้นให้กับ textview ของเรา รหัสต่อไปนี้อธิบายถึงวิธีการทำ

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

DateTime.Now.ToString() คลาสผูกเวลาของวันนี้กับวัตถุสตริง

ตอนนี้สร้างและเรียกใช้แอพ ควรแสดงผลลัพธ์ต่อไปนี้ -

ตัวเลือกเวลา

Time Picker เป็นวิดเจ็ตที่ใช้ในการแสดงเวลาและช่วยให้ผู้ใช้สามารถเลือกและตั้งเวลาได้ เรากำลังจะสร้างแอพตัวเลือกเวลาพื้นฐานที่แสดงเวลาและยังอนุญาตให้ผู้ใช้เปลี่ยนเวลาได้

ไปที่ main.axml และเพิ่มปุ่มใหม่มุมมองข้อความและตัวเลือกเวลาตามที่แสดงในรหัสต่อไปนี้

<?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>

ไปที่ MainActivity.cs เพื่อเพิ่มฟังก์ชั่นสำหรับการแสดงวันที่ที่กำหนดบน textview ที่เราสร้างขึ้น

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;
   } 
}

ในโค้ดด้านบนเราอ้างถึงไฟล์ timepicker,set time ปุ่มและมุมมองข้อความสำหรับแสดงเวลาผ่านไฟล์ FindViewById<>ชั้นเรียน จากนั้นเราสร้างเหตุการณ์การคลิกสำหรับปุ่มตั้งเวลาซึ่งเมื่อคลิกจะกำหนดเวลาเป็นเวลาที่บุคคลเลือก โดยค่าเริ่มต้นจะแสดงเวลาของระบบปัจจุบัน

setCurrentTime() คลาสเมธอดเริ่มต้น txt_showTime textview เพื่อแสดงเวลาปัจจุบัน

ตอนนี้สร้างและเรียกใช้แอปพลิเคชันของคุณ ควรแสดงผลลัพธ์ต่อไปนี้ -

ตัวหมุน

สปินเนอร์เป็นวิดเจ็ตที่ใช้เพื่อเลือกหนึ่งตัวเลือกจากชุด มันเทียบเท่ากับกล่องดรอปดาวน์ / คอมโบ ก่อนอื่นให้สร้างโครงการใหม่และเรียกมันว่าSpinner App Tutorial.

เปิด Main.axml ภายใต้ layout folder และสร้างไฟล์ 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>

เปิด Strings.xml ไฟล์อยู่ภายใต้ values folder และเพิ่มรหัสต่อไปนี้เพื่อสร้างไฟล์ 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>

ถัดไปเปิด MainActivity.cs เพื่อเพิ่มฟังก์ชันสำหรับการแสดงวันที่เลือกในสัปดาห์

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(); 
}

ตอนนี้สร้างและเรียกใช้แอปพลิเคชัน ควรแสดงผลลัพธ์ต่อไปนี้ -

ในโค้ดด้านบนเราอ้างอิงสปินเนอร์ที่เราสร้างในไฟล์ main.axml ไฟล์ผ่านไฟล์ FindViewById<>ชั้นเรียน จากนั้นเราได้สร้างไฟล์arrayAdapter() ซึ่งเราใช้ในการผูกรายการอาร์เรย์ของเราจากไฟล์ strings.xml ชั้นเรียน

ในที่สุดเราก็สร้างเมธอด SelectedDay() ซึ่งเราใช้เพื่อแสดงวันที่เลือกของสัปดาห์