آموزش ویجت های اندروید در برنامه نویسی زامارین

3 سال پیش

آموزش ویجت های اندروید در برنامه نویسی زامارین

در این درس از آموزش های برنامه نویسی سایت سورس باران، با آموزش ویجت های اندروید در برنامه نویسی زامارین در خدمت شما هستیم.

Date Picker

این یک ویجت است که برای نمایش تاریخ استفاده می شود. در این مثال، ما قصد داریم یک Date Picker ایجاد کنیم که تاریخ تعیین شده را در text view نمایش دهد.

اول از همه، یک پروژه جدید ایجاد کنید و آن را datePickerExample بنامید. Main.axml را باز کنید و یک text view ،Date Picker و یک دکمه ایجاد کنید.

<?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 بروید. ما ابتدا یک نمونه خصوصی از یک text view را در داخل کلاس 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 ارجاع می دهیم

پس از ارجاع، ما رویداد کلیک دکمه را تنظیم می کنیم که مسئول عبور تاریخ انتخاب شده از date picker به text view است.

بعد، ما متد ()setCurrentDate را برای نمایش تاریخ فعلی پیش فرض در text view خود ایجاد می کنیم. کد زیر نحوه انجام آن را توضیح می دهد.

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

کلاس DateTime.Now.ToString زمان امروز را به یک شی رشته متصل می کند.

بعد از ساخت و اجرای برنامه، خروجی به صورت زیر می باشد.

DatePicker

Time Picker

Time Picker یک ویجت است که برای نمایش زمان و همچنین امکان انتخاب و تنظیم زمان برای کاربر استفاده می شود. ما قصد داریم یک برنامه اصلی Time Picker ایجاد کنیم که زمان را نشان می دهد و همچنین به کاربر امکان تغییر زمان را می دهد.

به آدرس main.axml بروید و یک دکمه، textview و یک اTime Picker جدید مانند کد زیر اضافه کنید.

<?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 ارجاع دادیم. سپس یک رویداد کلیک برای دکمه set time شده ایجاد کردیم که با کلیک بر روی آن زمان انتخاب شده توسط شخص را تنظیم می کند. به طور پیش فرض، زمان سیستم فعلی را نشان می دهد.

کلاس متد setCurrentTime نمایش متنی txt_showTime را برای نمایش زمان فعلی آغاز می کند.

بعد از ساخت و اجرای برنامه، خروجی به صورت زیر می باشد.

Time Picker

Spinner

Spinner ویجتی است که برای انتخاب یک گزینه از مجموعه ای استفاده می شود. اول از همه، یک پروژه جدید ایجاد کنید و آن را Spinner App Tutorial بنامید.

Main.axml را در زیر پوشه layout باز کرده و یک 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(); 
}

بعد از ساخت و اجرای برنامه، خروجی به صورت زیر می باشد.

Spinner App

در کد بالا ، ما از طریق کلاس <>FindViewById به spinner که در فایل main.axml ایجاد کرده ایم، ارجاع می دهیم. سپس یک ()arrayAdapter جدید ایجاد کردیم که از آن برای اتصال آیتم های آرایه خود از کلاس strings.xml استفاده کردیم.

سرانجام ما متد ()SelectedDay را ایجاد کردیم که برای نمایش روز انتخاب شده در هفته استفاده کردیم.

منبع.

لیست جلسات قبل آموزش برنامه نویسی زامارین

نویسنده مطلب erfan molaei

آموزش ویجت های اندروید در برنامه نویسی زامارین

آموزش ویجت های اندروید در برنامه نویسی زامارین

Date Picker

Time Picker

Spinner

لیست جلسات قبل آموزش برنامه نویسی زامارین

دیدگاه شما

بدون دیدگاه

آموزش ویجت های اندروید در برنامه نویسی زامارین

Date Picker

Time Picker

Spinner

لیست جلسات قبل آموزش برنامه نویسی زامارین

دیدگاه شما

برای صرف‌نظر کردن از پاسخ‌گویی اینجا را کلیک نمایید.

بدون دیدگاه