CheckedTextView در اندروید

منتشرشده توسط حامد قنبری در تاریخ

در  اندروید CheckedTextView یک ویو تعمیم یافته از TextView است که از checkable بودن TextView پشتیبانی می کند و آن را نمایش می دهد.  این ویو به مانند TextView به منظور کارکرد خود لزوما دارای متن مشخصی است و  عمدتا در ListView بعنوان لیستی از گزینه های همراه با  علامت چک  استفاده می شود که لیستی از انتخاب های کاربر را بر روی لیست نشان می دهد.  البته باید توجه داشت که  دراین ویو باید ويژگی checkmark  را به یک رابط گرافیگی در Drawable متصل نمود تا  علامت چک بتواند قابلیت گرافیگی خود را بروز دهد. نکته دیگری که در ارتباط با این موضوع وجود دارد این است که باید توجه داشت که ما نمی توانیم وضعیت علامت چک را فقط با کلیک کردن بر روی UI تغییر دهیم، در عوض ما باید از یک listener برای انجام این کار استفاده کنیم.

 

نحوه اضافه کردن ExaminedTextView به پروژه:

 

بطور کلی  روش متداول برای ایجاد  ExaminedTextView در صفحه UIافزودن از طریق فایل  XML  است که به شکل زیر می باشد.

 

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent">
    <CheckedTextView
        android:id="@+id/CheckedTextView1"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:checkMark="@drawable/checkdrawable"
        android:text="yourtext here"
    />
</RelativeLayout>

 

در این روش در فایل XML  همانند فایل activity_main.xml  که در داخل پوشه res  و در داخل فایل layout  قرار دارد   درون یکی از لایوت های اصلی یا فرعی مانند  LinearLayout ،    ،RelativeLayout  و … تگ شروع شونده ExaminedTextView > را می نویسیم و سپس بعد از تعیین اندازه طول و عرض ویو، سایر  کد ویژگی های مربوط به آن مانند checkMark  ، checked بودن ، متن ویو ، رنگ متن ، اندازه متن و … را به آن  می افزاییم  و در نهایت با تگ پایانی /> آن را می بندیم. به منظور درک بیشتر موضوع به کدهای زیر دقت کنید:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent">
    <CheckedTextView
        android:id="@+id/CheckedTextView1"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:checkMark="@drawable/checkdrawable"
        android:text="yourtext here"
        android:checked="true"     حالت تیک دار بودن یا نبودن 
        android:gravity="center"
    />
</RelativeLayout>

 

همانطور که در کد هایXML بالایی می بینید ExaminedTextView نیز مانند سایر ویوهای فرزند در داخل لایوت اصلی ما یعنی  RelativeLayout  قرار دارد  و دارای ویژگی هایی است که به هنگام اجرای برنامه بر روی ویو اعمال می شود.

بعد از ایجاد ویو در UI  آنچه باید مورد عنایت دوستان قرار بگیرد این است که ویو مورد نظر جهت اعمال برخی ویژگی های دیگر و عملیات ها با استفاده از شناسه ویو به کلاس اصلی خود معرفی شود که در مثال ذکر شده ایدی  ExaminedTextView به شکل زیر تعریف شده است:

android:id=”@+id/CheckedTextView1″

دقت داشته باشید که بطور کلی برای فراخوانی ExaminedTextView و سایر ویوهای صفحه UI به  منظور برنامه نویسی بر روی آن در کلاس از متد

 

findViewById(R.id.yourid)

بهره می گیریم.

 

فلذا مطابق آنچه  گفته شده است در کلاس ها می بایست  نخست  فایل XML مرتبط با کلاس در قسمت مربوط به متد ()setContentViewمشخص شود. بدین معنی که ما باید تعیین کنیم که قصد داریم در این کلاس کدام فایل XML فراخوانی شود و سپس  آن ویو یا عناصر موجود در آن فایل  را بر اساس شناسه آن فراخوانی می کنیم  و آن در متغیری از نوع خود ذخیره می کنیم.

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.CheckedTextView;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        CheckedTextView simpleCheckedTextView = (CheckedTextView) findViewById(R.id.CheckedTextView1);
    }
}

 

تا اینجا م توانستیم ExaminedTextView مورد نظر خود را در فایل  Xml ایجاد کرده و آن را به کلاس موردنظر خودمان تعریف کنیم. اکنون لازم است مشخص کنیم که چگونه می توان از این ویو برای تغییر وضعیت مختلف استفاده نمود.

به منظور درک بهتر توضیحات مثالی برای دوستان در نظر گرفتیم که تا حدود زیادی می تواند راهگشای کار شما در امر یادگیری باشد. در این مثال قرار است کاربر با

اگر در داخل برنامه اکلیپس یا اندروید استودیو قرار دارید پروژه جدیدی را  ایجاد کنید

اکلیپس :File ⇒ New Android ⇒ Application Project

اندروید استودیو :File ⇒ New  ⇒ New Project

اما اگر هنوز برنامه خود را باز نکرده اید یکی از برنامه های فوق را باز نموده و بعد از تعیین مشخصات(نامگذاری) ، تعیین حداقل sdk  و نوع اکتیویتی (blank  یا Empty) ، نام اکتیویتی ابتدایی و اصلی خود  را همان MainActivity قرار دهید.

در مسیر res ⇒layout لایه متناظر اکتیوتی اصلی یعنی activity_main را پیدا نمود و کدهای مندرج و پیش فرض آن را پاک کرده و کدهای xml  زیر را به آن اضافه کنید:

 

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

        <ListView
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:id="@+id/listView"/>

 
</RelativeLayout>

فایل Xml  دیگری را ایجاد کرده و نام آن را list_items گذاشته و  در محتوای آن کدهای زیر را قرار دهید.

 

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <CheckedTextView
        android:id="@+id/CheckedTextView1"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="yourtext here"
        android:gravity="center"
        />

</RelativeLayout>

حال به سراغ کلاس MainActivity  رفته و کدهای مربوط به شناسایی لیست ویو  و سپس آداپتور را برای پر کردن داده ها در ListView از یک متغیر از Array String برای کلاس قرار می دهیم.

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.widget.ListView;

public class MainActivity extends AppCompatActivity {

    String value;
    String[] superStarNames = {"android", "php", "java", "c++", "visual basic"};

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


}

 

کلاس دیگری با نام CustomAdapter ایجاد می کنیم.در این مرحله برای پر کردن داده ها در ListView  کلاس  CustomAdapter را به نوع BaseAdapter گسترش می دهیم و سپس رویداد مربوط به  کلیک بر روی آیتم های لیست را به برنامه تعریف می کنیم . بدین معنی که هر زمان که یک کاربر روی CheckedTextView کلیک کند  ضمن اینکه وضعیت  جاری تغییر می کند و با استفاده از توست مقدار ارزش ویو مورد نظر نمایش داده شود.

 

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_items, null);
        final CheckedTextView checkedTextView = (CheckedTextView) view.findViewById(R.id.CheckedTextView1);
        checkedTextView.setText(names[position]);

        checkedTextView.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                if (checkedTextView.isChecked()) {

                    value = "un-Checked";
                    checkedTextView.setCheckMarkDrawable(0);
                    checkedTextView.setChecked(false);
                } else {

                    value = "Checked";
                    checkedTextView.setCheckMarkDrawable(R.drawable.checked);
                    checkedTextView.setChecked(true);
                }
                Toast.makeText(context, value, Toast.LENGTH_SHORT).show();
            }
        });
        return view;
    }
}

 

حال می توانید برنامه خود را اجرا کرده و نتیجه کار خود را ببینید.

موفق و پیروز باشید.

 


0 دیدگاه

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

-- بارگیری کد امنیتی --