أفضل المواقع تحميل جميع نسخ ويندوز

إنشاء القائمة المخصصة للبحث Custom Searchable Spinner في Android

سنتعلم في هذا البرنامج التعليمي إنشاء Custom Searchable Spinner باستخدام لغة الجافا في Android قد صادفنا جميعًا تطبيقات بها القائمة المخصصة للبحث الجميع الذين يقومون بتعليمها في اليوتيوب يخفون الكثير من الاكواد حول هذا المثال لأنها تستخدم في اكثر من واجهة في التطبيقات لذلك لو ارنا ان نستخدمها في عده واجهات ليس صحيح ان نقوم بتكرار الكود يجب ان نستخدم كود واحد بحيث يتم استدعه في جميع الواجهات في هذه المقالة ، دعنا نتعلم كيفية تنفيذ مثل القائمة المخصصة للبحث في تطبيق Android. فيما يلي لقد قمنا بعمل كود مميز يمكنكم استخدام في عدد واجهات اذا لديكم عده قوائم يمكنك استخدامه في تطبيقاتكم

رابط تحميل كود المشروع اسفل المقال

الخطوة 1 لاننسي اضافه المكتبة التالي الذي سوف نستخدمها

انسخ الكود التالي وقم بأضافتة في ملف gradle

   implementation 'com.toptoche.searchablespinner:searchablespinnerlibrary:1.3.1'
    

الخطوة 2  نقوم الان في ملف تصميم النشاط activity_main.xml بأضافة Spinner عند الضغط علية يتم ظهور عناصر القائمة و TextView اخر لعرض العنصر الذي تم تعيينة 

انسخ الكود التالي وقم بأضافتة في ملف activity_main.xml

  <LinearLayout
        android:layout_marginTop="20dp"
        android:layout_gravity="center"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical">


        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layoutDirection="rtl"
            android:layout_marginLeft="15dp"
            android:layout_marginRight="15dp"
            android:layout_marginTop="3.0dp"
            android:gravity="center"
            android:background="@drawable/border_txt"
            android:layout_gravity="center_horizontal"
            android:orientation="horizontal">

            <com.toptoche.searchablespinnerlibrary.SearchableSpinner
                android:id="@+id/spl_item"
                android:gravity="center"
                android:text="item"
                android:layout_width="0.0dp"
                android:layout_height="40dp"
                android:layout_weight="1" />

        </LinearLayout>


    </LinearLayout>


    <LinearLayout
        android:layout_gravity="center"
        android:gravity="center"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="vertical">


        <LinearLayout
            android:layout_gravity="center"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">


            <TextView
                android:id="@+id/txt_title"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:padding="5dp"
                android:layout_marginLeft="10.0dp"
                android:layout_marginTop="3.0dp"
                android:layout_marginRight="10.0dp"
                android:gravity="center"
                android:hint=""
                android:textColor="#03274B"
                android:textSize="30sp"
                android:fontFamily="@font/coffe" />

        </LinearLayout>
    </LinearLayout>
    

الخطوة 3 نقوم الان في ملف الجافا بأنشاء فئة class SpinnerView

الصق الكود التالي في ملف الجافا SpinnerView.java

public class SpinnerView implements OnItemSelectedListener {


	public interface onSelectedValueChangedEventListener
	{
	   void onSelectedValueChanged();
	}
	int check=0;
	public ArrayList<String> spinnerValue ;
	ArrayList<String> spinnerDisplay;
	ArrayAdapter<String> Adapter;
	Spinner newSpinner;
	int valueIndex=-1;
	onSelectedValueChangedEventListener myHandler;
    public void setSpinnerViewHandlerListener(onSelectedValueChangedEventListener listener)
    {
       myHandler=listener;
    }

	public SpinnerView(Context context, Spinner newSpinner1, String[] data, String title){
		check=0;
		this.newSpinner=newSpinner1;
		this.spinnerValue = new ArrayList<String>();
		this.spinnerDisplay = new ArrayList<String>();

		spinnerValue.add("-1");
		spinnerDisplay.add(title);

		for(int i=0;i<data.length;i++)
		{
			spinnerValue.add(String.valueOf(i));
			spinnerDisplay.add(data[i]);
		}
		Adapter=new ArrayAdapter<String>(context,android.R.layout.simple_spinner_dropdown_item, spinnerDisplay);
		newSpinner.setAdapter(Adapter);
		newSpinner.setOnItemSelectedListener(this);
	}



	public boolean IsEmpty()
	{
		try
		{
			if(spinnerValue.get(valueIndex).equalsIgnoreCase("-1"))
			{
				return true;
			}
		}
		catch (Exception ex)
		{

		}

		return false;
	}
	public String getSelectedValue(){
		if(IsEmpty())
			return "";
		else
			return spinnerValue.get(valueIndex);

	}



	public String getSelectedText(){
		if(IsEmpty())
			return "";
		else
			return spinnerDisplay.get(valueIndex);

	}

	public void setValue(String item) {
        if(item==null)
        {
            valueIndex=0;
            newSpinner.setSelection(valueIndex);
        }
        else
        {
            valueIndex=spinnerValue.indexOf(item);
            newSpinner.setSelection(valueIndex);
        }

	}


	@Override
	public void onItemSelected(AdapterView<?> arg0, View arg1, int arg2, long arg3) {
		check=check+1;
		if(valueIndex==-1)
		{
			valueIndex=arg0.getSelectedItemPosition();
		}

		if(check>1)
		{
			valueIndex=arg0.getSelectedItemPosition();
			if(myHandler!=null)
		            myHandler.onSelectedValueChanged();

		}
	}

	@Override
	public void onNothingSelected(AdapterView<?> arg0) {


	}
}

الخطوة اخير نقوم الان بربطها برمجيا في ملف الجافا  فئة MainActivity

الصق الكود التالي في ملف الجافا MainActivity.java

import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.Spinner;
import android.widget.TextView;
import android.widget.Toast;



public class MainActivity extends AppCompatActivity {


    TextView title_text;

    private Spinner spl_item;
    String Value_item;
    String Display_item;

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

        TextView textView = (TextView)findViewById(R.id.txt_title);
        this.title_text = textView ;
        this.spl_item = (Spinner) findViewById(R.id.spl_item);
     
        ConfigSpinner();

    }


    private void ConfigSpinner(){

        final SpinnerView sp=new SpinnerView(getBaseContext(),this.spl_item, 
		new String[]{"1 item","2 item","3 item","4 item","5 item","6 item","7 item"}, "اختار عنصر ...");
        if(Value_item!=null)
        {
            sp.setValue(Value_item);
        }
        sp.setSpinnerViewHandlerListener(new SpinnerView.onSelectedValueChangedEventListener()
        {
            @Override
            public void onSelectedValueChanged() {

                Value_item = sp.getSelectedValue();
                Display_item = sp.getSelectedText();

                if (Value_item.isEmpty())
                {
                    Toast.makeText(getBaseContext(), "الرجاء اختار عنصر" , Toast.LENGTH_SHORT).show();
                }
                else
                {

                     MainActivity.this.title_text.setText(Display_item);
                     Toast.makeText(getBaseContext(),Value_item,Toast.LENGTH_SHORT).show();
                }

            }
        });
    }

}

قم بتنزيل كود المصدر Custom Searchable Spinner مجانًا: انقر هـــــــــــــــنــــــا للتحميل

لا تنسوا متابعتنا على موقعنا و الاشتراك في قناتنا على اليوتيوب و مواقع التواصل الاجتماعي
والسلام عليكم ورحمة الله

شكرا لكم علي زيارة موقعنا " علوش لتقنية المعلومات "