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

سلام دوستان امیدوارم سلامت باشید در این سری از آموزش برنامه نویسی اندروید به آموزش ToggleButton در برنامه نویسی اندروید می پردازیم ToggleButton به گونه ای deprecated شده است و جای ToggleButton را Switch پر کرده است در ادامه با ما همراه باشید تا نحوه استفاده از ToggleButton را فرا گیرید.

برای اینکه از ToggleButton استفاده کنید لازم است در layout خود از tag مربوط به ToggleButton استفاده کنید همانند زیر

<ToggleButton
android:id="@+id/simpleToggleButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>

<ToggleButton

android:id="@+id/simpleToggleButton"

android:layout_width="wrap_content"

android:layout_height="wrap_content"/>

در بالا یک ToggleButton قرار گرفته بدون هیچ property یا ویژگی خاصی (ویژگی ها را در ادامه معرفی می کنیم)
با استفاده از کد زیر می توانیم آن را find کرده و با ویژگی های آن کار کنیم.

ToggleButton simpleToggleButton = (ToggleButton) findViewById(R.id.simpleToggleButton);
Boolean ToggleButtonState = simpleToggleButton.isChecked();

1 2	ToggleButton simpleToggleButton = (ToggleButton) findViewById(R.id.simpleToggleButton); Boolean ToggleButtonState = simpleToggleButton.isChecked();

در بالا بعد از اینکه آن را findviewbyid کردیم مقدار پیشرفض آن را در یک متغیر boolean ذخیره کردیم (این مقدار همان اول در متغیر قرار داده می شود و در ادامه تغییر نمی کند)
با استفاده از کد زیر تعیین می کنیم مقدار پیشفرض Toggle برابر با on یا روشن یا active باشد

<ToggleButton
    android:id="@+id/simpleToggleButton"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:checked="true" />

<ToggleButton

android:id="@+id/simpleToggleButton"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:checked="true" />

برای اینکه این کار با استفاده از کد انجام دهیم می توانیم مثل زیر عمل کنیم.

simpleToggleButton.setChecked(true);//true or false

1	simpleToggleButton.setChecked(true);//true or false

برای اینکه text مربوط به آن را راست چین کنیم می توانیم از gravity استفاده کنیم

<ToggleButton
    android:id="@+id/simpleToggleButton"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_centerHorizontal="true"
    android:checked="true"
    android:gravity="right|center_vertical"/>

<ToggleButton

android:id="@+id/simpleToggleButton"

android:layout_width="fill_parent"

android:layout_height="wrap_content"

android:layout_centerHorizontal="true"

android:checked="true"

android:gravity="right|center_vertical"/>

شاید بپرسید چگونه مقدار پیشفرض text مربوط به ToggleButton را تغییر دهیم ؟ برای اینکار می توانیم از دو ویژگی textOn و textOff می توانیم استفاده کنیم همانند زیر

<ToggleButton
    android:id="@+id/simpleToggleButton"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:checked="true"
    android:layout_centerHorizontal="true"
    android:textOff="Disable"
    android:textOn="Enable"/>

<ToggleButton

android:id="@+id/simpleToggleButton"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:checked="true"

android:layout_centerHorizontal="true"

android:textOff="Disable"

android:textOn="Enable"/>

در صورتی که می خواهید از طریق کد این کار را انجام دهید می توانید از کد زیر استفاده کنید.

simpleToggleButton.setTextOn("فعال");
simpleToggleButton.setTextOff("غیر فعال");

1 2	simpleToggleButton.setTextOn("فعال"); simpleToggleButton.setTextOff("غیر فعال");

برای تغییر رنگ می توانید از کد زیر استفاده کنید.

<ToggleButton
    android:id="@+id/simpleToggleButton"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:checked="false"
    android:textOff="On State"
    android:textOn="Off State"
    android:layout_centerHorizontal="true"
    android:textColor="#f00" />

<ToggleButton

android:id="@+id/simpleToggleButton"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:checked="false"

android:textOff="On State"

android:textOn="Off State"

android:layout_centerHorizontal="true"

android:textColor="#f00" />

برای اینکه یک آیکون به آن اضافه کنید می توانید از ویژگی هایی مانند drawableTop , drawableRight , drawableLeft و drawableBottom استفاده کنید.

<ToggleButton
    android:id="@+id/simpleToggleButton"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:checked="true"
    android:textOff="Off State"
    android:textOn="On State"
    android:layout_centerHorizontal="true"
    android:textColor="#000"
    android:drawableTop="@drawable/ic_launcher" />

<ToggleButton

android:id="@+id/simpleToggleButton"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:checked="true"

android:textOff="Off State"

android:textOn="On State"

android:layout_centerHorizontal="true"

android:textColor="#000"

android:drawableTop="@drawable/ic_launcher" />

ToggleButton دارای Listener های متفاوتی است از Listener نیز در حالت کاربردی میتوانید بهره بگیرید.

simpleToggleButton.setOnCheckedChangeListener( new OnCheckedChangeListener() {
        @Override
        public void onCheckedChanged(CompoundButton toggleButton, boolean isChecked) {
        }
    }) ;

simpleToggleButton.setOnCheckedChangeListener( new OnCheckedChangeListener() {

@Override

public void onCheckedChanged(CompoundButton toggleButton, boolean isChecked) {

}

}) ;

در بالا می توانید مقدار isChecked را مورد بررسی قرار دهید (با یک if ساده)
یک خط زیر Toggle به نام Indicator وجود دارد برای اینکه آن را تغییر دهید می توانید Style تعریف کنید همانند زیر

<style name="AppTheme.ToggleButton" parent="Base.Widget.AppCompat.Button">
        <item name="colorButtonNormal">@color/colorPrimary</item>
        <item name="android:textColor">@android:color/white</item>
        <item name="colorAccent">@android:color/white</item>
    </style>

<item name="colorButtonNormal">@color/colorPrimary</item>

<item name="android:textColor">@android:color/white</item>

<item name="colorAccent">@android:color/white</item>

</style>

سپس همانند زیر از آن استفاده کنید.

<ToggleButton
            android:id="@+id/programchi_toggle"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:theme="@style/AppTheme.ToggleButton" />

<ToggleButton

android:id="@+id/programchi_toggle"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:theme="@style/AppTheme.ToggleButton" />

راه پیشنهادی دوم برای اینکار
یک فایل به نام toggle_selector.xml در پوشه drawable ایجاد کنید و کدهای زیر را در آن قرار دهید.

<item android:drawable="@drawable/bg_selected" android:state_checked="true" android:state_pressed="true"/>
<item android:drawable="@drawable/bg_selected" android:state_checked="true" android:state_focused="false"/>
<item android:drawable="@drawable/bg_normal" android:state_checked="false" android:state_pressed="true"/>
<item android:drawable="@drawable/bg_normal" android:state_checked="false" android:state_focused="false"/>

شما باید دوتا عکس به نام های bg_selected و bg_normal بسازید تا دو تا حالت نرمال و انتخاب شده را تعییر دهید سپس مثل زیر از آن استفاده کنید.

<ToggleButton
    android:id="@+id/toggleButton"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="@drawable/btntoggle_selector"
    android:textColor="@android:color/white"
    android:textOff="Toggle Button OFF"
    android:textOn="Toggle Button ON "
    android:onClick="onToggleButtonClick"/>

<ToggleButton

android:id="@+id/toggleButton"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:background="@drawable/btntoggle_selector"

android:textColor="@android:color/white"

android:textOff="Toggle Button OFF"

android:textOn="Toggle Button ON "

android:onClick="onToggleButtonClick"/>

موفق باشید.

مطالعه بیشتر

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

مطالب مشابه

دیدگاهتان را بنویسید لغو پاسخ

مطالب مشابه

دیدگاهتان را بنویسید لغو پاسخ

اشتراک گذاری در شبکه های اجتماعی