1172 نیروی متخصص آماده کـار برای شمـا هستند
حالا پروژه خود را ایجاد کنید
تعداد طراحان اندروید 1029
تعداد نرم افزار های اندروید 1
تعداد طراحان آی او اس 1007
تعداد نرم افزارهای آی او اس 0
آخرین اخبار سایت
ابزار نمایش Gallery و Image View

ابزار نمایش Gallery و ImageView

قصد معرفی ابزارهای نمایشی را داریم که قابلیت نمایش تصاویر را دارند واین که چطوراز منوی متن در برنامه های اندروید بهره ببریم.

استفاده از ابزارهای نمایش تصویر

جهت نمایش دادن تصاویر و عکس ها از ابزارهای نمایشی ImageView, Gallery,ImageSwitcher و GridView استفاده می شود.

ابزارهای نمایش Gallery و ImageView

از ابزار نمایش Gallery برای نمایش برخی از آیتم ها به صورت افقی و با قابلیت پیمایش، استفاده می کنیم. در شکل زیر نحوه ی نشان دادن تصاویر توسط Gallery را می بینید:

 

نحوه ی کار با این ابزار:

1.در اکلیپس یک پروژه ی جدید با نام Gallery بسازید.

2.فایل main.xml را به صورت زیر تغییر دهید:

<?”xml version=”1.0” encoding=”utf-8?>
”LinearLayout xmlns:android=”http://schemas.android.com/apk/res/android>
”android:orientation=”vertical
”android:layout_width=”fill_parent
<”android:layout_height=”fill_parent
TextView>
”android:layout_width=”fill_parent
”android:layout_height=”wrap_content
</”android:text=”Images of San Francisco
Gallery>
”android:id=”@+id/gallery1
”android:layout_width=”fill_parent
<”android:layout_height=”wrap_content
ImageView>
”android:id=”@+id/image1
”android:layout_width=”320px
”android:layout_height=”250px
</”android:scaleType=”fitXY
<LinearLayout/>

 

3.روی فولدر res/values کلیک راست کرده و یک NEWFile ایجاد کنید. نام فایل را attrs.xml بگذارید.

4.فایل attrs.xml را به صورت زیر تغییر دهید:

<?”xml version=”1.0” encoding=”utf-8?>
<resources>
<”declare-styleable name=”Gallery1>
<”/attr name=”android:galleryItemBackground>
<declare-styleable/>
<resources/>

 

5.یتعدادی عکس فراهم کرده و آنها را با نام های pic1.png و pic2.png و... نام گذاری کنید.

6.عکس ها را با موس گرفته و به فولدر res/drawable-mspi  انتقال دهید. وقتی پیغامی ظاهر شد Copy files را انتخاب کرده و روی Ok بزنید.

 

در این مثال برنامه در یک AVD با رزولوشن متوسط تست شده است.اما در واقعیت باید مطمئن باشید که تصاویر برای هر رزولوشنی و در پوشه ی مربوطه وجود داشته باشد.

7.فایل MainActivity.java را به صورت زیر اصلاح کنید:

;package com.PRG.Gallery
;import android.app.Activity
;import android.os.Bundle
;import android.content.Context
;import android.content.res.TypedArray
;import android.view.View
;import android.view.ViewGroup
;import android.widget.AdapterView
;import android.widget.AdapterView.OnItemClickListener
;import android.widget.BaseAdapter
;import android.widget.Gallery
;import android.widget.ImageView
;import android.widget.Toast
} public class MainActivity extends Activity 
---the images to display---//
  } = Integer[] imageIDs 
,R.drawable.pic1
,R.drawable.pic2
,R.drawable.pic3
,R.drawable.pic4
,R.drawable.pic5
,R.drawable.pic6
,R.drawable.pic7
;{
/* .Called when the activity is first created **/
Override@
} (public void onCreate(Bundle savedInstanceState
;(super.onCreate(savedInstanceState
;(setContentView(R.layout.main
;(Gallery gallery = (Gallery) findViewById(R.id.gallery1
;((gallery.setAdapter(new ImageAdapter(this
()gallery.setOnItemClickListener(new OnItemClickListener
}
,public void onItemClick(AdapterView<?> parent, View v
(int position, long id
}
,()Toast.makeText(getBaseContext
,”pic” + (position + 1) + “ selected“
;()Toast.LENGTH_SHORT).show
}
;({
{
public class ImageAdapter extends BaseAdapter
}
;private Context context
;private int itemBackground
(public ImageAdapter(Context c
}
;context = c
---setting the style---//
;(TypedArray a = obtainStyledAttributes(R.styleable.Gallery1
)itemBackground = a.getResourceId
;(R.styleable.Gallery1_android_galleryItemBackground, 0
;()a.recycle
}
---returns the number of images---//
} ()public int getCount
;return imageIDs.length
{
---returns the ID of an item---//
} (public Object getItem(int position
;(return position
{
---returns the ID of an item---//
} (public long getItemId(int position
;return position
{
---returns an ImageView view---//
} (public View getView(int position, View convertView, ViewGroup parent
;(ImageView imageView = new ImageView(context
;([imageView.setImageResource(imageIDs[position
;(imageView.setScaleType(ImageView.ScaleType.FIT_XY
;((imageView.setLayoutParams(new Gallery.LayoutParams(150, 120
;(imageView.setBackgroundResource(itemBackground
;return imageView
{    
{  
{

 

8.در شبیه ساز برنامه را اجرا کنید. در تصویر نشان داده شده ابزار نمایش گالری را در حال نمایش چند عکس ملاحظه می فرمایید.

با کلیک بر روی یک عکس ، به وسیله ی کلاس Toast پیغامی نشان داده می شود.

 

9.برای نمایش داده شدن عکس انتخابی در ابزار نمایش ImageView ، نیاز است که فایل MainActivity.java به صورت زیر ویرایش شود:

/* .Called when the activity is first created **/
Override@
} (public void onCreate(Bundle savedInstanceState
;(super.onCreate(savedInstanceState
;(setContentView(R.layout.main
;(Gallery gallery = (Gallery) findViewById(R.id.gallery1
;((gallery.setAdapter(new ImageAdapter(this
()gallery.setOnItemClickListener(new OnItemClickListener
}
,public void onItemClick(AdapterView<?> parent, View v
(int position, long id
}
,()Toast.makeText(getBaseContext
,”pic” + (position + 1) + “ selected“
;()Toast.LENGTH_SHORT).show
---display the images selected---//
;(ImageView imageView = (ImageView) findViewById(R.id.image1
;([imageView.setImageResource(imageIDs[position
{
;({
{

 

10.مجدداً برنامه  در شبیه ساز اجرا شود .حالا میتوانید تصویر انتخابی را در ImageView مشاهده کنید.

 

روش کار

ابتدا Gallery و ImageView را به فایل main.xml بیافزایید:

Gallery>
”android:id=”@+id/gallery1
”android:layout_width=”fill_parent
</”android:layout_height=”wrap_content
ImageView>
”android:id=”@+id/image1
”android:layout_width=”320px
”android:layout_height=”250px
</”android:scaleType=”fitXY

 

 گالری برای نمایش تصاویر در حالت افقی استفاده میشود.

ImageView برای نمایش عکس انتخاب شده توسط کاربر استفاده می شود.

در آرایه ی imageIDs لیستی از تصاویر که باید نمایش داده شوند ذخیره شده :

---the images to display---//
} = Integer[] imageIDs  
,R.drawable.pic1
,R.drawable.pic2
,R.drawable.pic3
,R.drawable.pic4
,R.drawable.pic5
,R.drawable.pic6
R.drawable.pic7
;{

 

کلاس ImageAdapter که کلاس BaseAdapter را بسط می دهد ایجاد شده و میتواند ابزار Gallery را به تعدادی از ابزارهای ImageView متصل کنید:

;(Gallery gallery = (Gallery) findViewById(R.id.gallery1
;((gallery.setAdapter(new ImageAdapter(this
()gallery.setOnItemClickListener(new OnItemClickListener
}
,public void onItemClick(AdapterView<?> parent, View v
(int position, long id)
}
,()Toast.makeText(getBaseContext
,”pic” + (position + 1) + “ selected“
;()Toast.LENGTH_SHORT).show
---display the images selected---//
;(ImageView imageView = (ImageView) findViewById(R.id.image1
;([imageView.setImageResource(imageIDs[position
{
;({

 

زمانیکه یک تصویر در ابزار نمایش Gallery انتخاب شود ، محل عکس انتخاب شده (0 برای عکس اول,1 برای عکس دوم و ...) نشان داده شده و همچنین آن عکس نیز در ImageView نشان داده می شود.


  • دسته بندی :
  • تاریخ انتشار : 06 خرداد 1396
  • بازدید : 765

برچسب ها :