در این بخش قصد داریم تا مهمترین کنترل های ویژوال در برنامه نویسی اندروید را معرفی کنیم. در بخش های قبلی با محیط اکلیپس آشنا شده و نحوه ایجاد یک پروژه اندرویدی را فرا گرفتید. و دیدید که با دراگ و دراپ کردن کنترل ها روی بخش دیداری اکتیویتی ، کنترل ها به آن اضافه شده و در پنجره properties امکان تنظیم خصوصیات کنترل ها فراهم شده است.

در این بخش کنترل ها زیر معرفی شده و ویژگی ها اصلی این کنترل ها معرفی می شود:

انواع کنترل های ویژوال در رابط گرافیکی اندروید

شماره توضیحات و نام UI Control
۱ TextView: اگر شما میخواهید متنی را در اپلیکیشن خود وارد کنید، مقدار این المنت را تغییر دهید
۲ EditText: نوعی از TextView که توسط کاربر استفاده کننده از برنامه، مقدار آن قابل تغییر است
۳ AutoCompleteTextView: نوعی از EditText است که قبل از اینکه کاربر بخواهد چیزی تایپ کند، کلمه ی مورد نظر را حدس می‌زند
۴ Button: همان دکمه ی خودمان که شما با کدنویسی میتوانید وقایع بعد از کلیک بر روی آن را مشخص کنید
۵ ImageButton: یک دکمه با خاصیت AbsolutLayout که میتوانید یک عکس را به عنوان پس زمینه آن قرار دهید
۶ CheckBox: با این المنت شما میتوانید لیستی از انتخاب برای کاربر ایجاد کنید و کاربر میتواند آن را انتخاب کند یا نه
۷ ToggleButton: در مواقعی که شما میخواهید از دو دکمه در کنار یکدیگر استفاده کنید
۸ RadioButton: همان CheckBox اما از نوع دایره ای
۹ RadioGroup: دسته ای از چند RadioButton
۱۰ ProgressBar: نواری که وضعیت پردازش برنامه را در پشت صحنه آن نشان می‌دهد
۱۱ Spinner: لیست باز شونده که میتوان در مقادیری را جای داد
۱۲ TimePicker: المنتی بسیار ساده که زمان دقیق درج شده بر روی دستگاه کاربر را به او نشان می‌دهد
۱۳ DatePicker: همان TimePicker با این تفاوت که تاریخ دقیق را نشان می‌دهد

نحوه ساخت یک UI Control با کدنویسی XML

 

با درگ و دراپ کردن این کنترل ها به روی اکتیویتی، کنترل ویژوال اضافه می شوند و هر کدام از این کنترل ها در پنجره properties دارای یک خاصیت id هستند که شناسه کنترل را تعیین می کند. برای این خاصیت باید یک نام مناسب و خوانایی را مطابق با روش نامگذاری ها وارد کرد. در پنجره کدنویسی اکتیویتی با استفاده از همین id به کنترل دسترسی پیدا می کنیم.

رابط کاربر هر اکتیویتی در دو نمای گرافیکی (Graphical) و XML نشان داده می شود. با اضافه کردن هر کنترل در نمای گرافیکی، کد مناسبی در نمای XML به آن اضافه می شود. در تصویر زیر کد اضافه شده برای یک جعبه متن(TextView) را مشاهده می کنید . id این جعبه متن به text_id تنظیم شده  و خاصیت text آن با I am a TextView مقداردهی شده است.

 

کدنویسان - تصویر کنترل ویژوال در محیط کدنویسی

در پنجره کد نویسی اکتیویتی تقریباً هر کاری روی کنترل ها با استفاده از شناسه(id) آنها  انجام می شود کد زیر نحوه دسترسی به یک کنترل ویژوال را در محیط کدنویسی و مقدادهیمحتوای آنرا نشان می دهد.
TextView txt=(TextView) findViewById(R.id.text_id);
txt.setText("Hello");