Switch in android studio

تدوينة اليوم عن زر مهم جدا في عمليات التحكم في التطبيقات وهو احد ازرار الايقاف والتشغيل ومشابه بنسبة كبيرة جدا لزر التبديل ToggleButton
Switch عبارة عن زر تبديل بين حالتين وهو من ازرار الايقاف والتشغيل ويحمل قيمة منطقية واحدة إما true or false ويستخدم في عرض الحالة المحددة chescked وغير المحددة unchecked عندما ينقر المستخدم عليه
وبما أنه من أزرار الايقاف والتشغيل إذا يستخدم في العمليات المنطقية مثل إيقاف وتشغيل الصوت او الواي فاي او البلوتوث او الفلاش وغيرها من التطبيقات .
وهو كلاس فرعي يرث من كلاس CompoundButton مثله مثل زر togglebutton.
وفي حيث المقارنة بينه وبين زر التبديل ToggleButton فانه يوفر للمستخدم بساطة النقر لتغير القيمة الحالية ,بالاضافة الي أنه اكثر جازبية من زر ToggleButton.

طرق إدراج الزر في البرنامج

1. عن طريق السحب والإفلات Drag&Drop في لوحة التصميم

2. عن طريق ملف XML file

الشكل الاساسي لزر Switch

إفتح مشروع جديد في البرنامج وقم بتسميته بالاسم الذي تريد ثم
Open res -> layout -> activity_main.xml (or) main.xml اكتب الكود التالي ليظهر لك الزر في تطبيق المعاينة:

   <Switch
        android:id="@+id/btn_forSwitch"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

خصائص زر Switch

إسم الخاصية	إستخدامه
id	خاصية إعطاء الزر إسم فريد لا يشترك فيه زر أخر ويسخدم هذا الاسم في ملف الجافا عندما نريد إعطاء بعض الاوامر لهذا الزر
checked	توفر هذه الخاصية تحديد الحالة الحالية للزر إما محددة checked او غير محددة unchecked وهي قيمة منطقية إما true or false والقيمة الافتراضية هي false
text	يمكن كتابة م تريد داخل الزر بإستخدام هذه الخاصية
gravity	خاصية محازاة النص داخل الزر وفقا للاتجاهات مثل right, left, bottom, center
textOn	تظهر هذه الخاصية القيمة التي بداخلها عندما تكون الحالة محددة أي ان checked="true"
textOff	تظهر هذه الخاصية القيمة التي بداخلها عندما تكون الحالة غير محددة أي ان checked="false"
textColor	خاصية إعطاء النص الذي بداخل الزر لون محدد android:textColor="#fff"
textSize	خاصية تعين حجم النص وتأخذ قيمة عددية Double مثل 10.8,20,50 وتقاس بوحدة sp
textStyle	تعين شكل النص داخل الزر وتأخذ إحدي القيم bold or italic
background	تعين لون او صورة ليكون خلفية للزر
padding	تحدد المسافة بين النص وحافة الزر الداخلية وتأخذ قيم الاتجاهات right, left, top, bottom, center وتكون القيمة عددية android:paddingRight="20dp"
drawableValue	خاصية تعين صورة وفقا للاتجاه المحدد وتكون القيمة كلاتي android:drawableRight="مكان تواجد الصورة" value ="right,left,top,bottom"

قم بكتابةالكود التالي وشاهد النتيجة ثم قم بتغير القيم الي أخري وشاهد النتيجة كل مرة لتري كل القيم تتحق

<?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:padding="20dp">

    <Switch
        android:id="@+id/simpleSwitch"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:checked="true"
        android:drawableBottom="@drawable/ic_android_black_24dp"
        android:gravity="center"
        android:text="switch"
        android:textColor="#00e736"
        android:textOff="Off"
        android:textOn="On"
        android:textSize="25sp" />
</LinearLayout>

مثال شامل علي زر Switch

في داخل ملف الفعالية الرئيسية activity_main.xml قم بكتابة الكود التالي

activity_main.xml

<LinearLayout 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"
    android:orientation="vertical"
    android:layout_marginTop="30dp"
    tools:context=".MainActivity">

    <Switch
        android:id="@+id/simples11"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:checked="true"
        android:text="switch1"
        android:textOff="Off"
        android:textOn="On"
        android:textSize="26sp"
        android:textColor="#000" />

    <Switch
        android:id="@+id/simples22"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:checked="false"
        android:text="switch2"
        android:textOff="Off"
        android:textOn="On"
        android:textSize="26sp" />


    <Button
        android:id="@+id/submitButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_marginTop="50dp"
        android:background="#f5959e87"
        android:padding="10dp"
        android:text="Submit"
        android:textColor="#fff"
        android:textSize="20sp"
        android:textStyle="bold" />
</LinearLayout>

داخل ملف الجافا قم بكتابة الكود التالي مع تغير إسم الحزمة وستجده اعلي الصفحة بإسم package الاسم الخاص بك;

MainActivity.java

package //قم بكتابة إسم الحزمة الخاص بك هنا;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.Switch;
import android.widget.Toast;
import android.widget.ToggleButton;

import static engahmed.gagacademy.R.id.simpleToggleButton1;
import static engahmed.gagacademy.R.id.simpleToggleButton2;

public class MainActivity extends AppCompatActivity {
    Switch simpleSwitch1, simpleSwitch2;
    Button submit;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        simpleSwitch1 = (Switch) findViewById(R.id.simples11);
        simpleSwitch2 = (Switch) findViewById(R.id.simples22);
        submit = (Button) findViewById(R.id.submitButton);
        submit.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                String statusSwitch1, statusSwitch2;
                if (simpleSwitch1.isChecked())
                    statusSwitch1 = simpleSwitch1.getTextOn().toString();
                else
                    statusSwitch1 = simpleSwitch1.getTextOff().toString();
                if (simpleSwitch2.isChecked())
                    statusSwitch2 = simpleSwitch2.getTextOn().toString();
                else
                    statusSwitch2 = simpleSwitch2.getTextOff().toString();
                Toast.makeText(getApplicationContext(), "Switch1 :" + statusSwitch1 + "\n" + "Switch2 :" + statusSwitch2, Toast.LENGTH_LONG).show(); //ستعرض رسالة توضح حالة الازرار 
            }
        });
    }
}