برنامج CheckedTextView التعليمي مع مثال في Android Studio
في Android ، يعد CheckedTextView امتدادًا لـ TextView العادي الذي يدعم الواجهة القابلة للفحص ويعرضها. يحتوي على خانة اختيار مع بعض النصوص. يتم استخدامه بشكل أساسي في ListView حيث نريد إظهار العنصر الذي تم تحديده أم لا. يتم استخدام سمة علامة الاختيار لتوفير رسم أو رسم قابل للرسم إلى CheckedTextView.
ملاحظة مهمة: في CheckedTextView ، يتعين علينا تعيين android:checkMarkالسمة لتوفير رسم أو قابل للرسم وإلا فلن تظهر علامة الاختيار وتتصرف مثل TextView العادي. شيء آخر هو أنه لا يمكننا تغيير حالة علامة الاختيار فقط من خلال النقر على واجهة المستخدم ، بدلاً من ذلك يتعين علينا استخدام مستمع للقيام بذلك. سنشرح كل هذا أدناه.
رمز CheckedTextView الأساسي في XML:
ملاحظة مهمة جدًا: قبل استخدام أي رمز في هذه المقالة ، تأكد من تنزيل هذه الصورة وحفظها في المجلد القابل للرسم المسمى على أنه محدد. يمكنك أيضًا تنزيل الصورة بالنقر فوقها أدناه.
<!--Make sure to download checked image and save in your drawable folder--> <CheckedTextView android:id="@+id/simpleCheckedTextView" android:layout_width="fill_parent" android:layout_height="wrap_content" android:checked="true" android:gravity="center" android:checkMark="@drawable/checked" android:text="Checked Text View" />
جدول المحتويات
الحصول على الحالة الحالية لـ CheckedTextView:
isChecked (boolean): تُستخدم هذه الطريقة للحصول على الحالة الحالية لـ CheckedTextView. تقوم هذه الطرق بإرجاع قيمة نوع منطقي تعني صواب أو خطأ. يعود صحيحًا إذا تم تحديد CheckedTextView حاليًا ويعيد القيمة false إذا لم يكن كذلك.
يوجد أدناه مثال على رمز نتحقق فيه من الحالة الحالية لـ CheckedTextView.
CheckedTextView simpleCheckedTextView = (CheckedTextView) findViewById(R.id.simpleCheckedTextView); // initiate a CheckedTextView Boolean checkedValue = simpleCheckedTextView.isChecked(); // check current state of CheckedTextView
سمات وخصائص CheckedTextView :
الآن دعنا نناقش بعض السمات والخصائص المهمة التي تساعدنا في تكوين CheckedTextView في ملف xml الخاص بك .
1. المعرف id : تستخدم هذه السمة لتعريف CheckedTextView بشكل فريد.
2. علامة الاختيار checkmark : تُستخدم هذه السمة لتعيين الرسم القابل للرسم لعلامة الاختيار.
ملاحظة: احفظ أولاً اسم الصورة كما هو محدد في مجلد قابل للرسم قبل استخدام الكود أدناه.
<CheckedTextView android:id="@+id/simpleCheckedTextView" android:layout_width="fill_parent" android:layout_height="wrap_content" android:checkMark="@drawable/checked" android:checked="true" android:gravity="center" android:text="Android" /><!-- bottom drawable of a CheckedTextView -->
إعداد checkMark In Java Class:
CheckedTextView simpleCheckedTextView = (CheckedTextView) findViewById(R.id.simpleCheckedTextView); // initiate a CheckedTextView simpleCheckedTextView.setCheckMarkDrawable(R.drawable.checked); // set drawwable for check mark for CheckedTextView
3. فحص checked : يتم استخدام هذه السمة لتعيين الحالة الحالية لـ CheckedTextView. يمكننا أيضًا تغيير الحالة فيفئة Java باستخدام طريقة setChecked (). بشكل افتراضي ، تكون قيمة هذه السمة خاطئة.
في كود checkMark أعلاه ، استخدمنا أيضًا هذه السمة.
ضبط الخاصية المحددة في فئة Java:
استخدم الكود أدناه لتعيين الخاصية المحددة إلى true برمجيًا.
CheckedTextView simpleCheckedTextView = (CheckedTextView) findViewById(R.id.simpleCheckedTextView); // initiate a CheckedTextView simpleCheckedTextView.setChecked(true); // set current state to true for CheckedTextView
4. النص text : يتم استخدام هذه السمة لتعيين النص في CheckedTextView. يمكننا ضبط النص في xml وكذلك فيفئة java . في كود checkMark أعلاه ، استخدمنا أيضًا سمة النص.
إعداد نص CheckedTextView في فئة Java:
CheckedTextView simpleCheckedTextView = (CheckedTextView) findViewById(R.id.simpleCheckedTextView); // initiate a CheckedTextView
simpleCheckedTextView.setText("AbhiAndroid"); // set AbhiAndroid text for CheckedTextView
5. textColor: تُستخدم هذه السمة لتعيين لون نص CheckedTextView. تكون قيمة اللون على شكل "#argb" أو "#rgb" أو "#rrggbb" أو "#aarrggbb".
أدناه قمنا بتعيين اللون الأخضر للنص المعروض في CheckedTextView.
<CheckedTextView android:id="@+id/simpleCheckedTextView" android:layout_width="fill_parent" android:layout_height="wrap_content" android:checked="true" android:checkMark="@drawable/checked" android:textColor="#0f0" android:text="Android" /> <!-- green text color for CheckedTextView -->
ضبط النص لون CheckText عرض النص في فئة Java:
CheckedTextView simpleCheckedTextView = (CheckedTextView) findViewById(R.id.simpleCheckedTextView); // initiate a CheckedTextView simpleCheckedTextView.setTextColor(Color.GREEN); // set green text color for CheckedTextView
6. textSize: تستخدم هذه السمة لتعيين حجم نص CheckedTextView. يمكننا ضبط حجم النص في sp (مقياس البيكسل المستقل) أو في dp (كثافة البكسل).
أدناه قمنا بتعيين حجم 20 sp لنص CheckedTextView.
<CheckedTextView android:id="@+id/simpleCheckedTextView" android:layout_width="fill_parent" android:layout_height="wrap_content" android:checked="true" android:gravity="center" android:checkMark="@drawable/checked" android:textColor="#0f0" android:textSize="20sp" android:text="Android" /> <!-- 20 sp displayed text Size of a CheckedTextView -->
ضبط حجم النص CheckedTextView Text في فئة Java:
CheckedTextView simpleCheckedTextView = (CheckedTextView) findViewById(R.id.simpleCheckedTextView); // initiate a CheckedTextView simpleCheckedTextView.setTextSize(20); // set text size for CheckedTextView
7. textStyle: تُستخدم هذه السمة لتعيين نمط نص CheckedTextView. أنماط النص الممكنة هي غامقة ومائلة وعادية. إذا احتجنا إلى استخدام نمطين أو أكثر لعرض النص ، فحينئذٍ "|" عامل يستخدم لذلك.
أدناه قمنا بتعيين أنماط النص الغامق والمائل لنص CheckedTextView.
<CheckedTextView android:id="@+id/simpleCheckedTextView" android:layout_width="fill_parent" android:layout_height="wrap_content" android:checked="true" android:checkMark="@drawable/checked" android:textSize="20sp" android:text="Android" android:textStyle="bold|italic"/> <!-- bold and italic text style for a CheckedTextView -->
8. الخلفية background : يتم استخدام هذه السمة لتعيين خلفية CheckedTextView. يمكننا تعيين لون أو قابل للرسم في خلفية CheckedTextView.
أدناه قمنا بتعيين اللون الأسود للخلفية ، واللون الأبيض للنص المعروض في CheckedTextView.
<CheckedTextView android:id="@+id/simpleCheckedTextView" android:layout_width="fill_parent" android:layout_height="wrap_content" android:checked="true" android:checkMark="@drawable/checked" android:textColor="#fff" android:background="#000" android:textSize="20sp" android:text="AbhiAndroid" android:textStyle="bold|italic"/> <!-- black background of a CheckedTextView -->
إعداد خلفية CheckedTextView في فئة Java:
CheckedTextView simpleCheckedTextView = (CheckedTextView) findViewById(R.id.simpleCheckedTextView); // initiate a CheckedTextView simpleCheckedTextView.setBackgroundColor(Color.BLACK); // set black background for CheckedTextView
9. drawableBottom، drawableTop، drawableRight and drawableLeft : هذه السمة ترسم الرسم القابل للرسم أدناه ، أعلى ، يمين ويسار نص CheckedTextView.
أدناه نحفظ صورة ic_launcher في مجلد قابل للرسم ثم نستخدمها لتعيينها على أنها drawableLeft. بنفس الطريقة يمكنك تجربة السمات الثلاثة الأخرى بنفسك.
<CheckedTextView
android:id="@+id/simpleCheckedTextView"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:checked="true"
android:gravity="center"
android:checkMark="@drawable/checked"
android:textColor="#fff"
android:background="#000"
android:textSize="20sp"
android:text="Android"
android:drawableLeft="@drawable/ic_launcher"
android:textStyle="bold|italic"/> <!-- bottom drawable of a CheckedTextView -->
مثال CheckedTextView في Android Studio
المثال 1: CHECKEDTEXTVIEW مع مثال LISTVIEW في ANDROID STUDIO
يوجد أدناه مثال CheckedTextView الذي نعرض فيه قائمة بأسماء Superstar في CheckedTexView باستخدام BaseAdapter. في هذا نقوم بتغيير الحالة الحالية لـ CheckedTextView عند النقر فوق الحدث. عندما ينقر المستخدم على CheckedTextView هذا ، يتم تغيير الحالة الحالية وفحصها أو عرض القيمة غير المحددة باستخدام Toast.
يمكنك أدناه تنزيل كود مشروع Android Studio الكامل والإخراج النهائي والشرح خطوة بخطوة:
الخطوة 1 : قم بإنشاء مشروع جديد وقم بتسميته CheckedTextViewExample
الخطوة 2: افتح res -> layout -> activity_main. xml (or) main.xml وأضف الكود التالي لعرض ListView :
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" tools:context=".MainActivity"> <ListView android:layout_width="fill_parent" android:layout_height="fill_parent" android:id="@+id/listView"/> </RelativeLayout>
الخطوة 3: قم بإنشاء تنسيق xml list_items.xml جديد وأضف الكود أدناه لعرض CheckedTextView باستخدام سماته المختلفة:
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <CheckedTextView android:id="@+id/simpleCheckedTextView" android:layout_width="fill_parent" android:layout_height="50dp" android:checked="false" android:gravity="center_vertical" android:paddingLeft="15dp" android:textColor="#000" android:text="Checked Text View Example" /> <!-- CheckedTextView In Android --> </LinearLayout>
الخطوة 4: افتح src -> package -> MainActivity. جافا
في هذه الخطوة ، نضيف الكود لبدء ListView ثم ضبط المحول لملء البيانات في ListView من صفيف سلسلة.
package example.abhiandroid.checkedtextviewexample;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.Menu;
import android.view.MenuItem;
import android.widget.ListView;
public class MainActivity extends AppCompatActivity {
String value;
String[] superStarNames = {"John Cena", "Randy Orton", "Triple H", "Roman Reign", "Sheamus"};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// initiate a ListView
ListView listView = (ListView) findViewById(R.id.listView);
// set the adapter to fill the data in ListView
CustomAdapter customAdapter = new CustomAdapter(getApplicationContext(), superStarNames);
listView.setAdapter(customAdapter);
}
}
الخطوة 5: إنشاء فئة جديدة CustomAdapter.java داخل الحزمة وإضافة التعليمات البرمجية التالية
في هذا نقوم بتوسيع BaseAdapter لملء البيانات في ListView ثم إجراء حدث انقر على عناصر القائمة. عندما ينقر المستخدم على CheckedTextView ، يتم تغيير الحالة الحالية وفحصها أو عرض القيمة غير المحددة باستخدام Toast.
package example.abhiandroid.checkedtextviewexample;
import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.CheckedTextView;
import android.widget.Toast;
public class CustomAdapter extends BaseAdapter {
String[] names;
Context context;
LayoutInflater inflter;
String value;
public CustomAdapter(Context context, String[] names) {
this.context = context;
this.names = names;
inflter = (LayoutInflater.from(context));
}
@Override
public int getCount() {
return names.length;
}
@Override
public Object getItem(int position) {
return null;
}
@Override
public long getItemId(int position) {
return 0;
}
@Override
public View getView(int position, View view, ViewGroup parent) {
view = inflter.inflate(R.layout.list_view_items, null);
final CheckedTextView simpleCheckedTextView = (CheckedTextView) view.findViewById(R.id.simpleCheckedTextView);
simpleCheckedTextView.setText(names[position]);
// perform on Click Event Listener on CheckedTextView
simpleCheckedTextView.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
if (simpleCheckedTextView.isChecked()) {
// set cheek mark drawable and set checked property to false
value = "un-Checked";
simpleCheckedTextView.setCheckMarkDrawable(0);
simpleCheckedTextView.setChecked(false);
} else {
// set cheek mark drawable and set checked property to true
value = "Checked";
simpleCheckedTextView.setCheckMarkDrawable(R.drawable.checked);
simpleCheckedTextView.setChecked(true);
}
Toast.makeText(context, value, Toast.LENGTH_SHORT).show();
}
});
return view;
}
}
المخرجات :
الآن قم بتشغيل التطبيق وسترى أسماء WWE Superstar مدرجة في ListView. انقر الآن على أي Superstar وستلاحظ ظهور checkbox على الجانب الأيمن. عند إعادة النقر فوق نفس الاسم المحدد ، سيظهر checkbox .