سبد (0)

آموزش سویچر تصویر اندروید

آموزش سویچر تصویر اندروید

گاهی اوقات نمی خواهید که تصویری به طور ناگهانی روی صفحه ظاهر شود، بلکه ترجیح می دهید به جای تصویری که تغییر می کند، انیمیشن به کار ببرید. این عمل در اندروید  با ImageSwitcher پشتیبانی می شود.

سویچر تصویر به شما اجازه می دهد تا روی طریقه ی ظاهر شدن تصاویر در صفحه، تغییراتی اعمال کنید. برای استفاده از سویچر تصویر، ابتدا باید مولفه xml آن را تعریف کنید که ترکیب آن را در زیر مشاهده می کنید.

 

<ImageSwitcher
   android:id="@+id/imageSwitcher1"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:layout_centerHorizontal="true"
   android:layout_centerVertical="true" >
</ImageSwitcher>

اکنون ما در فایل جاوا یک نمونه ImageSwithcer ایجاد کرده ایم و یک مرجع از مولفه ی XML آن به دست می آوریم. ترکیب آن را در زیر مشاهده می کنید.

 

private ImageSwitcher imageSwitcher;
imageSwitcher = (ImageSwitcher)findViewById(R.id.imageSwitcher1);

کار دیگری که انجام می دهید اجرای اینترفیس ViewFactory و اجرای روش اجرا نشده ای می باشد که یک imageView را گزارش می دهد. ترکیب آن مانند زیر است.

 

imageSwitcher.setImageResource(R.drawable.ic_launcher);
imageSwitcher.setFactory(new ViewFactory() {
   public View makeView() {
      ImageView myView = new ImageView(getApplicationContext());
      return myView;
   }
}

در انتها لازم است که Animation را به ImageSwithcer اضافه کنید. باید آبجکتی از گروه Animation را از طریق گروه AnimationUtilities و با فراخوانی روش استاتیک loadAnimation تعریف کنید، که ترکیب آن را در زیر مشاهده می کنید.

 

Animation in = AnimationUtils.loadAnimation(this,android.R.anim.slide_in_left);
imageSwitcher.setInAnimation(in);
imageSwitcher.setOutAnimation(out);

روش setInAnimaton ظهور انیمیشن آبجکت روی صفحه را تنظیم می کند، در حالیکه setOutAnimation عمل عکس آن را انجام می دهد. روش loadAnimation()  یک آبجکت انیمیشن ایجاد می کند.

علاوه بر این روش ها، روش های تعریف شده ی دیگری در ImageSwitcher وجود دارند که در جدول زیر مشاهده می کنید:

  • setImageDrawable(Drawable drawable)

    یک تصویر را با سویچر تصویر تنظیم می کند. تصویر به فرم bitmap  منتقل می شود.

  • setImageResource(int resid)

    یک تصویر را با سویچر تصویر تنظیم می کند. تصوویر به فرم یک id  کامل منتقل می شود.

  • setImageURI(Uri uri)

    یک تصویر را با سویچر تصویر تنظیم می کند. تصویر THE به فرم URI منتقل می شود.

  • ImageSwitcher(Context context, AttributeSet attrs)

    یک آبجکت image switcher را با تنظیم چند ویژگی تصویب شده در روش، بازمی گرداند.

  • onInitializeAccessibilityEvent (AccessibilityEvent event)

    یک AccessibilityEvent را با اطلاعاتی در مورد این ویو که منبع رویداد می باشد، مقداردهی اولیه می کند.

  • onInitializeAccessibilityNodeInfo (AccessibilityNodeInfo info)

    یک AccessibilityNodeInfo را با اطلاعاتی در مورد این ویو مقداردهی اولیه می کند.

مثال:

مثال زیر برخی تاثیرات image switcher را روی bitmap توضیح می دهد. این مثال برنامه ی پایه ای ایجاد می کند که به شما اجازه می دهد تا تاثیرات انیمیشن را روی تصاویر ببینید.

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

  • برای ایجاد یک برنامه ی اندروید از Eclipse IDE استفاده خواهید کرد و آن را با عنوان  ImageSwitcher   تحت بسته ی com.PRG.imageswitcher. نام گذاری کنید. زمان ایجاد این برنامه مطمئن شوید که Target SDKو Compile With در آخرین ورژن Android SDKهستند تا از سطوح بالاتر API استفاده کنید.

  • فایل src/MainActivity.java را برای افزودن کد لازم تغییر دهید.

  • res/layout/activity_main رابرای افزودن مولفه های XML مربوطه تغییر دهید.

  • برنامه را اجرا کنید، یک دستگاه اجرایی اندروید انتخاب کنید و برنامه را روی آن نصب کرده و نتایج را بررسی کنید.

در زیر محتوای تغییریافته ی فایل فعالیت اصلی را مشاهده می کنید.

 

package com.PRG.sairamkrishna.myapplication;

import android.app.Activity;
import android.app.ActionBar.LayoutParams;
import android.app.Activity;
import android.os.Bundle;

import android.view.Menu;
import android.view.MenuItem;
import android.view.View;

import android.widget.Button;
import android.widget.ImageSwitcher;
import android.widget.ImageView;
import android.widget.Toast;
import android.widget.ViewSwitcher.ViewFactory;

public class MainActivity extends Activity {
   private ImageSwitcher sw;
   private Button b1,b2;
   
   @Override
   protected void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.activity_main);
      
      b1 = (Button) findViewById(R.id.button);
      b2 = (Button) findViewById(R.id.button2);
      
      sw = (ImageSwitcher) findViewById(R.id.imageSwitcher);
      sw.setFactory(new ViewFactory() {
         @Override
         public View makeView() {
            ImageView myView = new ImageView(getApplicationContext());
            myView.setScaleType(ImageView.ScaleType.FIT_CENTER);
            myView.setLayoutParams(new ImageSwitcher.LayoutParams(LayoutParams.WRAP_CONTENT,LayoutParams.WRAP_CONTENT));
            return myView;
         }
      });
      
      b1.setOnClickListener(new View.OnClickListener() {
         @Override
         public void onClick(View v) {
            Toast.makeText(getApplicationContext(), "previous Image",Toast.LENGTH_LONG).show();
            sw.setImageResource(R.drawable.abc);
         }
      });
      
      b2.setOnClickListener(new View.OnClickListener() {
         @Override
         public void onClick(View v) {
            Toast.makeText(getApplicationContext(), "Next Image",Toast.LENGTH_LONG).show();
            sw.setImageResource(R.drawable.tp);
         }
      });
   }
   
   @Override
   public boolean onCreateOptionsMenu(Menu menu) {
      // Inflate the menu; this adds items to the action bar if it is present.
      getMenuInflater().inflate(R.menu.menu_main, menu);
      return true;
   }
   
   @Override
   public boolean onOptionsItemSelected(MenuItem item) {
      // Handle action bar item clicks here. The action bar will
      // automatically handle clicks on the Home/Up button, so long
      // as you specify a parent activity in AndroidManifest.xml.
      
      int id = item.getItemId();
      
      //noinspection SimplifiableIfStatement
      if (id == R.id.action_settings) {
         return true;
      }
      return super.onOptionsItemSelected(item);
   }
}

در زیر محتوای تغییریافته ی xml فایل res/layout/activity_main.xmlرا مشاهده می کنید.

 

<RelativeLayout 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:paddingLeft="@dimen/activity_horizontal_margin"
   android:paddingRight="@dimen/activity_horizontal_margin"
   android:paddingTop="@dimen/activity_vertical_margin"
   android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity">
      
   <TextView android:text="Gestures  PRG" android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:id="@+id/textview"
      android:textSize="35dp"
      android:layout_alignParentTop="true"
      android:layout_centerHorizontal="true" />
      
   <TextView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="Tutorials point"
      android:id="@+id/textView"
      android:layout_below="@+id/textview"
      android:layout_centerHorizontal="true"
      android:textColor="#ff7aff24"
      android:textSize="35dp" />
      
   <ImageSwitcher
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:id="@+id/imageSwitcher"
      android:layout_below="@+id/textView"
      android:layout_centerHorizontal="true"
      android:layout_marginTop="168dp" />
      
   <Button
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="<"
      android:id="@+id/button"
      android:layout_below="@+id/textView"
      android:layout_centerHorizontal="true" />
      
   <Button
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text=">"
      android:id="@+id/button2"
      android:layout_alignParentBottom="true"
      android:layout_alignLeft="@+id/button"
      android:layout_alignStart="@+id/button" />
      
</RelativeLayout>

در زیر محتوای فایل AndroidManifest.xml را مشاهده ی کنید.

 

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
   package="com.PRG.imageswitcher"
   android:versionCode="1"
   android:versionName="1.0" >

   <application
      android:allowBackup="true"
      android:icon="@drawable/ic_launcher"
      android:label="@string/app_name"
      android:theme="@style/AppTheme" >
      
      <activity
         android:name="com.PRG.ImageSwitcher"
         android:label="@string/app_name" >
         
         <intent-filter>
            <action android:name="android.intent.action.MAIN" />
            <category android:name="android.intent.category.LAUNCHER" />
         </intent-filter>
         
      </activity>
      
   </application>
</manifest>

اجازه بدهید برنامه ImageSwitcher را اجرا کنیم. فرض می کنیم که در هنگام انجام تنظیمات محیط، AVD خود را ایجاد کرده اید. برای اجرای برنامه از eclipse، یکی از فایل های فعالیت پروژه را باز کنید و روی آیکن Run  از تولبار کلیک کنید. Eclipse برنامه را روی AVD شما نصب و آغازمی کند

اکنون اگر به صفحه ی دستگاه خود نگاه کنید، دو دکمه خواهید دید.

اکنون دکمه ی بالایی با فلش به سمت راست انتخاب کنید. یک تصویر از سمت راست ظاهر می شود که به سمت چپ حرکت می کند، که در تصویر زیر مشاهده می کنیدو اگر  روی دکمه ی پایینی ضربه بزنید که تصویر قبل را با کمی تغییر برمی گرداند.

تمامی محصولات و خدمات این وبسایت، حسب مورد دارای مجوزهای لازم از مراجع مربوطه می‌باشند و فعالیت‌های این سایت تابع قوانین و مقررات جمهوری اسلامی ایران است.
logo-samandehiمجوز نشر دیجیتال از وزرات فرهنگ و ارشاد اسلامیپرداخت آنلاین -  بانک ملتمعرفی بیاموز در شبکه سهپرداخت آنلاین - بانک اقتصاد نوینپرداخت آنلاین - بانک سامان