شرح AdapterViewFlipper في الاندرويد

برنامج AdaptorViewFlipper التعليمي مع مثال في Android Studio

في Android ، يكون AdapterViewFlipper هو نفسه ViewFlipper الذي يتم استخدامه للتبديل بين طرق العرض. إنه عنصر من عناصر عنصر واجهة الانتقال الذي يساعدنا على إضافة انتقالات في طرق العرض. من المفيد بشكل أساسي تحريك عرض على الشاشة. AdapterViewFlipper التبديل بسلاسة بين اثنين أو أكثر من وجهات النظر ( TextView ، ImageView أو أي تخطيط)، وبالتالي يوفر وسيلة الانتقال من رأي واحد إلى آخر من خلال الرسوم المتحركة المناسبة. يمكنك إنشاء طرق عرض لعنصر واجهة مستخدم AdapterViewFlipper إما بإضافتها على التخطيط الخاص بك أو عن طريق تعيين محول من العناصر.

AdaptorViewFlipper في Android

ملاحظة مهمة: يعتبر كل من ViewFlipper و AdapterViewFlipper من الفئات الفرعية لـ ViewAnimator . والفرق الوحيد هو ViewFlipper نحن عادة يعلن عن الأطفال في خط الهجوم، وليس هناك مفهوم إعادة التدوير ولكن في AdapterViewFlipper، ونحن استخدام محول بيانات التعبئة (كما اعتدنا في ListView ، سبينر ، الخ)، بحيث يتم تحديد الأطفال على الطاير ويمكن إعادة تدوير الآراء التي تمثل الأطفال.

جدول المحتويات

1 رمز XMLViewFlipper الأساسي للمحول:
2 طرق مهمة للمحولViewFlipper:
3 سمات محولViewFlipper:
4 مثال على AdaptorViewFlipper في Android Studio:

كود AdapterViewFlipper الأساسي

<AdapterViewFlipper
  android:id="@+id/simpleAdapterViewFlipper"
  android:layout_width="match_parent"
  android:layout_height="wrap_content" >
  <!--   Add View’s Here -->
  </AdapterViewFlipper >

طرق مهمة للمحول ViewFlipper

دعونا نناقش بعض الطرق المهمة لـ AdapterViewFlipper التي قد يتم استدعاؤها من أجل إدارة AdapterViewFlipper.

1. setAdapter (Adapter adapter ): تُستخدم هذه الطريقة لتعيين المحول الذي يوفر البيانات وطرق العرض لتمثيل البيانات في هذه الأداة. لإعداد البيانات في AdaptorViewFlipper ، لدينا خيارات متعددة للمحولات . نحن نستخدم BaseAdapter لملء البيانات في AdaptorViewFlipper لأن BaseAdapter هو المحول الرئيسي ويستخدم لمزيد من التخصيص في طرق العرض.

أدناه قمنا بتعيين المحول لـ AdapterViewFlipper.

AdapterViewFlipper simpleAdapterViewFlipper = (AdapterViewFlipper) findViewById(R.id.simpleAdapterViewFlipper); // get the reference of AdapterViewFlipper
  simpleAdapterViewFlipper.setAdapter(adapter); // set adapter for AdapterViewFlipper. Here adapter is object of custom adapter

2. startFlipping (): تُستخدم هذه الطريقة لبدء عداد الوقت للتنقل بين العروض الفرعية. في وقت ما نحتاج إلى بدء التقليب عند النقر أو أي حدث آخر ، ثم نستخدم هذه الطريقة لبدء تقليب وجهات النظر.

أدناه نبدأ المؤقت للتنقل عبر عرض الطفل لـ AdaptorViewFlipper.

AdapterViewFlipper simpleAdapterViewFlipper = (AdapterViewFlipper) findViewById(R.id.simpleAdapterViewFliper); // get the reference of AdapterViewFlipper
  simpleAdapterViewFlipper.startFlipping(); // start the flipping of views

3. stopFlipping (): تستخدم هذه الطريقة لإيقاف المؤقت مما يعني أنه لا يوجد المزيد من التقلبات. في وقت ما نحتاج إلى إيقاف التقليب عند النقر أو أي حدث آخر ، ثم نستخدم هذه الطريقة لإيقاف تقليب وجهات النظر.

أدناه نقوم بإيقاف المؤقت للتنقل عبر عرض الطفل لـ AdaptorViewFlipper.

AdapterViewFlipper simpleAdapterViewFlipper = (AdapterViewFlipper) findViewById(R.id.simpleAdapterViewFlipper); // get the reference of AdapterViewFlipper
  simpleAdapterViewFlipper.stopFlipping(); // stop the flipping of views

4. setFlipInterval ( int milliseconds ): تُستخدم هذه الطريقة لضبط الفاصل الزمني بالمللي ثانية على طول فترة الانتظار قبل التقليب إلى العرض التالي.

أدناه قمنا بتعيين 4 ثوانٍ لوقت الفاصل الذي يوضح مدة الانتظار قبل التقليب إلى العرض التالي.

AdapterViewFlipper simpleAdapterViewFlipper = (AdapterViewFlipper) findViewById(R.id.simpleAdapterViewFlipper); // get the reference of AdapterViewFlipper
  simpleAdapterViewFlipper.setFlipInterval(4000); // set 4 seconds for interval time

5. getFlipInterval (): تُرجع هذه الطريقة وقت الفاصل الزمني بالمللي ثانية إلى متى يجب الانتظار قبل التقليب إلى العرض التالي.

أدناه نحصل على وقت الفاصل الزمني الذي يوضح مدة الانتظار قبل التقليب إلى العرض التالي.

AdapterViewFlipper simpleAdapterViewFlipper = (AdapterViewFlipper) findViewById(R.id.simpleViewFlipper); // get the reference of AdapterViewFlipper
  int flipInterval=simpleAdapterViewFlipper.getFlipInterval(); // get the flip interval time

6. setAutoStart (boolean autoStart): تُستخدم هذه الطريقة لبدء التقليب تلقائيًا بين طرق العرض. يتم تعيين هذه الطريقة إذا كان هذا العرض يستدعي تلقائيًا startFlipping () عندما يتم إرفاقه بنافذة.

أدناه قمنا بتعيين القيمة الحقيقية لبدء التشغيل التلقائي لتقليب وجهات النظر.

AdapterViewFlipper simpleAdapterViewFlipper = (AdapterViewFlipper) findViewById(R.id.simpleAdapterViewFlipper); // get the reference of AdapterViewFlipper
  simpleAdapterViewFlipper.setAutoStart(true); // set true value for auto start the flipping between views

7. isAutoStart (): تُستخدم هذه الطريقة للتحقق مما إذا كانت العروض تبدأ بالتقليب تلقائيًا أم لا. ترجع هذه الطريقة قيمة نوع منطقي إما صواب أو خطأ. يعود صحيحًا إذا كان هذا العرض يستدعي تلقائيًا startFlipping () عندما يتم إرفاقه بنافذة ويعيد القيمة false إذا لم يكن كذلك.

أدناه نتحقق مما إذا كانت العروض تقلب تلقائيًا أم لا.

AdapterViewFlipper simpleAdapterViewFlipper = (AdapterViewFlipper) findViewById(R.id.simpleAdapterViewSwitcher); // get the reference of AdapterViewFlipper
  Boolean isAutoStart = simpleAdapterViewFlipper.isAutoStart();  // checks whether the views are automatically start flipping or not.

8. isFlipping (): تُستخدم هذه الطريقة للتحقق مما إذا كانت العروض تقلب أم لا. ترجع هذه الطريقة قيمة منطقية إما صواب أو خطأ. إنها ترجع صحيحًا إذا كانت المشاهدات التابعة تنقلب وتُعيد القيمة false إذا لم تكن كذلك.

أدناه نتحقق مما إذا كانت المشاهدات تقلب حاليًا أم لا.

AdapterViewFlipper simpleAdapterViewFlipper = (AdapterViewFlipper) findViewById(R.id.simpleAdapterViewSwitcher); // get the reference of AdapterViewFlipper
  Boolean isFlipping= simpleAdapterViewFlipper.isFlipping();  // check whether the views are flipping or not

9. showNext (): تُستخدم هذه الطريقة لإظهار العرض التالي لـ AdaptorViewFlipper. كما ناقشنا سابقًا ، يمكن أن يكون لـ AdaptorViewFlipper عرضان فرعيان أو أكثر يتم عرض واحد منهما فقط في كل مرة ، لذلك يتم استخدام هذه الطريقة لإظهار العروض التالية.

أدناه نقوم بإجراء انقر فوق الزر واستدعاء طريقة showNext () لإظهار العرض التالي في AdaptorViewFlipper.

AdapterViewFlipper simpleAdapterViewFlipper = (AdapterViewFlipper) findViewById(R.id.simpleAdapterViewFlipper); // get the reference of AdapterViewFlipper

  Button btnNext=(Button) findViewById(R.id.buttonNext); // get the reference of Button
  // set Click event on next button
  btnNext.setOnClickListener(new View.OnClickListener() {

  public void onClick(View v) {
  // TODO Auto-generated method stub
  // show the next view of ViewFlipper
  simpleAdapterViewFlipper.showNext();
  }
  });

10. showPrevious (): تُستخدم هذه الطريقة لإظهار العرض السابق لـ AdaptorViewFlipper. كما ناقشنا سابقًا ، يمكن أن يكون لـ AdaptorViewFlipper عرضان فرعيان أو أكثر يتم عرض واحد منهما فقط في كل مرة ، لذلك يتم استخدام هذه الطريقة لإظهار طرق العرض السابقة.

أدناه نقوم بتنفيذ انقر فوق الحدث على الزر واستدعاء طريقة showPrevious () لإظهار العرض السابق في AdaptorViewFlipper.

AdapterViewFlipper simpleAdapterViewFlipper = (AdapterViewFlipper) findViewById(R.id.simpleAdapterViewFlipper); // get the reference of AdapterViewFlipper

  Button btnPrevious=(Button) findViewById(R.id.buttonPrevious); // get the reference of Button
  // set Click event on next button
  btnPrevious.setOnClickListener(new View.OnClickListener() {

  public void onClick(View v) {
  // TODO Auto-generated method stub
  // show the next view of ViewFlipper
  simpleAdapterViewFlippper.showPrevious();
  }
  });

سمات و خصائص AdaptorViewFlipper

الآن دعنا نناقش بعض السمات الشائعة لـ AdaptorViewFlipper التي تساعدنا على تكوينها في تخطيطنا ( xml ).

1. المعرف id : السمة id تستخدم لتعريف AdaptorViewFlipper بشكل فريد.

أدناه قمنا بتعيين معرف AdaptorViewFlipper الذي يتم استخدامه لتعريفه بشكل فريد.

<AdapterViewFlipper
  android:id="@+id/simpleAdapterViewFlipper"
  android:layout_width="match_parent"
  android:layout_height="wrap_content" >
  </AdapterViewFlipper >

2. بدء التشغيل التلقائي autoStart : تُستخدم هذه الخاصية لبدء الحركة / التقليب بين طرق العرض تلقائيًا. يمكنك أيضًا بدء التقليب تلقائيًا برمجيًا باستخدام طريقة setAutoStart ().

أدناه ، قمنا بتعيين القيمة الحقيقية لخاصية autoStart الخاصة بـ AdapterViewFlipper والتي ستبدأ تلقائيًا في الحركة بين طرق العرض.

<AdapterViewFlipper
  android:id="@+id/simpleAdapterViewFlipper"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:autoStart="true" > <!-- set Auto Start to true -->
  <!--   Add View’s Here -->
  </AdapterViewFlipper >

3. flipInterval: تُستخدم هذه الخاصية لضبط الفاصل الزمني بالمللي ثانية لمدة الانتظار قبل التقليب إلى العرض التالي. يمكنك أيضًا ضبط الفاصل الزمني برمجيًا فيفئة جافا باستخدام طريقة setFlipInterval ().

أدناه قمنا بتعيين 3 ثوانٍ للوقت الفاصل للتقليب بين طرق العرض.

<AdapterViewFlipper
  android:id="@+id/simpleAdapterViewFlipper"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:flipInterval="3000> <!--  set interval time for flipping the views -->
  <!--   Add View’s Here -->
  </AdapterViewFlipper >

4. الحشو padding : تُستخدم هذه السمة لتعيين الحشوة من الجانب الأيسر أو الأيمن أو العلوي أو السفلي من AdaptorViewFlipper.

padding إلى اليمين: تُستخدم هذه السمة لتعيين الحشوة من الجانب الأيمن من AdaptorViewFlipper.
paddingLeft: تُستخدم هذه السمة لتعيين المساحة المتروكة من الجانب الأيسر من AdaptorViewFlipper.
paddingTop: تُستخدم هذه السمة لتعيين الحشوة من الجانب العلوي من AdaptorViewFlipper.
paddingBottom: تُستخدم هذه السمة لتعيين الحشو من الجانب السفلي من AdaptorViewFlipper.
الحشو padding : تُستخدم هذه السمة لتعيين الحشوة من جميع جوانب AdaptorViewFlipper.

أدناه قمنا بتعيين حشوة 10dp من جميع جوانب ViewFlipper

<AdapterViewFlipper
  android:id="@+id/simpleAdapterViewFlipper"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:padding="10dp"> <!-- set 10 dp padding from all the sides of ViewFlipper -->

  <!--   Add View’s Here -- >

  </AdapterViewFlipper >

5. الخلفية background : تُستخدم هذه السمة لتعيين خلفية AdaptorViewFlipper. يمكننا تعيين لون أو رسم قابل للرسم في خلفية الخلفية: تُستخدم هذه السمة لتعيين خلفية AdaptorViewFlipper.

يوجد أدناه مثال على الكود مع شرح مضمن حيث قمنا بتعيين اللون الأزرق لخلفية AdaptorViewFlipper.

<AdapterViewFlipper
  android:id="@+id/simpleViewFlipper"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:background="#00f"> <!-- set blue color in the background of ViewFlipper -->

  <!--   Add View’s Here -- >

  </AdapterViewFlipper >

إعداد الخلفية في AdaptorViewFlipper في فئة Java:

AdapterViewFlipper simpleAdapterViewFlipper=(AdapterViewFlipper)findViewById(R.id. simpleAdapterViewFlipper); // get reference of AdapterViewFlipper
  simpleAdapterViewFlipper.setBackgroundColor(Color.BLUE);// set blue color in the background of ImageFlipper.

مثال على AdapterViewFlipper في Android Studio

يوجد أدناه مثال AdapterViewFlipper الذي نعرض فيه AdapterViewFlipper ونقوم بتعيين العروض فيه باستخدام BaseAdapter. أولاً ، نقوم بإنشاء صفيفين أحدهما لصور الفاكهة والآخر لأسماء الفاكهة. بعد الإنشاء ، قمنا بتعيين المحول لملء البيانات في طرق العرض. وأخيرا تحديد بداية السيارات والوقت الفاصل الآخر بحيث AdapterViewFlipper التبديل بين وجهات النظر وطريقة العرض الحالية سوف تخرج وسوف رأي المقبل تأتي في بعد فترة زمنية معينة.

أدناه يمكنك تنزيل كود المشروع الكامل ، انظر الإخراج النهائي والشرح خطوة بخطوة للمثال:

تحميل الكود ؟

مثال على AdapterViewFlipper في Android Studio

الخطوة 1: قم بإنشاء مشروع جديد وقم بتسميته AdapterViewFlipperExample

الخطوة 2: افتح res -> layout -> activity_main. xml (أو) main. xml وأضف الكود التالي:

في هذه الخطوة ، نفتح ملف xml ونضيف الكود لعرض AdaptorViewFlipper باستخدام سماته المختلفة.

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:background="#fff"
  android:orientation="vertical">

  <AdapterViewFlipper
  android:id="@+id/simpleAdapterViewFlipper"
  android:layout_width="match_parent"
  android:layout_height="wrap_content">

  </AdapterViewFlipper>

  </LinearLayout>

الخطوة 3: الآن قم بإنشاء تخطيط XML آخر. في حالتنا ، نسميها list_item.xml. أضف الكود أدناه فيه.

في هذه الخطوة ، نضيف ImageView واحدًا وآخر TextView في ملف أو ملف xml لاستخدامه في المحول.

<?xml version="1.0" encoding="utf-8"?>
  <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:background="#fff"
  android:gravity="center"
  android:orientation="vertical">

  <ImageView
  android:id="@+id/fruitImage"
  android:layout_width="wrap_content"
  android:layout_height="150dp"
  android:layout_gravity="center" />

  <TextView
  android:id="@+id/fruitName"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:layout_gravity="center"
  android:layout_marginTop="2dp"
  android:textColor="#000" />
  </LinearLayout>

الخطوة 4: افتح src -> package -> MainActivity. جافا

في هذه الخطوة نفتح MainActivity ونضيف الكود لبدء AdapterViewFlipper. أولاً ، نقوم بإنشاء صفيفين أحدهما لصور الفاكهة والآخر لأسماء الفاكهة. بعد الإنشاء ، قمنا بتعيين المحول لملء البيانات في طرق العرض. أخيرا تحديد بداية السيارات والوقت الفاصل الآخر بحيث AdapterViewFlipper التبديل بين وجهات النظر وطريقة العرض الحالية سوف تخرج وسوف رأي المقبل تأتي في بعد فترة زمنية معينة.

package com.example.ip_d.viewflipperexample;

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

  public class MainActivity extends AppCompatActivity {

  private AdapterViewFlipper simpleAdapterViewFlipper;
  int[] fruitImages = {R.drawable.apple, R.drawable.pineapple, R.drawable.litchi, R.drawable.mango, R.drawable.banana};     // array of images
  String fruitNames[] = {"Apple", "Pine Apple", "Litchi", "Mango", "Banana"};

  @Override
  protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.activity_main);
  simpleAdapterViewFlipper = (AdapterViewFlipper) findViewById(R.id.simpleAdapterViewFlipper); // get the reference of AdapterViewFlipper
  // Custom Adapter for setting the data in Views
  CustomAdapter customAdapter = new CustomAdapter(getApplicationContext(), fruitNames, fruitImages);
  simpleAdapterViewFlipper.setAdapter(customAdapter); // set adapter for AdapterViewFlipper
  // set interval time for flipping between views
  simpleAdapterViewFlipper.setFlipInterval(3000);
  // set auto start for flipping between views
  simpleAdapterViewFlipper.setAutoStart(true);
  }
  }

الخطوة 5: إنشاء فئة جديدة CustomAdapter. java وإضافة التعليمات البرمجية التالية في هذه الخطوة ، نقوم بإنشاء فئة محول مخصصة وتوسيع BaseAdapter في ذلك. في هذا وضعنا البيانات في وجهات النظر.

package com.example.ip_d.viewflipperexample;

  import android.content.Context;
  import android.view.LayoutInflater;
  import android.view.View;
  import android.view.ViewGroup;
  import android.widget.BaseAdapter;
  import android.widget.ImageView;
  import android.widget.TextView;

  public class CustomAdapter extends BaseAdapter {
  Context context;
  int[] fruitImages;
  String[] fruitNames;
  LayoutInflater inflter;

  public CustomAdapter(Context applicationContext, String[] fruitNames, int[] fruitImages) {
  this.context = applicationContext;
  this.fruitImages = fruitImages;
  this.fruitNames = fruitNames;
  inflter = (LayoutInflater.from(applicationContext));

  }

  @Override
  public int getCount() {
  return fruitNames.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_item, null);
  TextView fruitName = (TextView) view.findViewById(R.id.fruitName);
  ImageView fruitImage = (ImageView) view.findViewById(R.id.fruitImage);
  fruitName.setText(fruitNames[position]);
  fruitImage.setImageResource(fruitImages[position]);
  return view;
  }
  }

المخرجات :

الآن قم بتشغيل التطبيق وسترى صور فواكه مختلفة تنزلق على الشاشة بعد فجوة زمنية قدرها 3 ثوان.

تعديل المقال

تعلم البرمجة مجانا

شرح AdapterViewFlipper في الاندرويد

برنامج AdaptorViewFlipper التعليمي مع مثال في Android Studio

كود AdapterViewFlipper الأساسي

طرق مهمة للمحول ViewFlipper

سمات و خصائص AdaptorViewFlipper

مثال على AdapterViewFlipper في Android Studio

مقالات قد تهمك