آموزش برنامه نویسی اندروید |
آموزش StackView در برنامه نویسی اندروید
سلام دوستان در این سری از آموزش برنامه نویسی اندروید به آموزش StackView در برنامه نویسی اندروید می پردازیم SatckView برای arrange کردن یکسری item برای نمایش در حالت خاص استفاده می شود و آیتم ها قابلیت رفتن بروی روی هم را نیز دارند در ادامه ویدیوی زیر را تماشا کنید تا بیشتر با StackView آشنا شوید با ما همراه باشید.
ما در اکتیویتی اصلی کد های زیر را قرار خواهیم داد نام 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" >
<StackView
android:id="@+id/stackView1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:animateLayoutChanges="true" >
</StackView>
</RelativeLayout>
چون ما در اینجا آداپتور سفارشی داریم باید شکل ظاهری آن رو هم خودمان درست کنیم کار آداپتور در اینجا قرار دادن متن و عکس است.
پس در همان پوشه layout یک فایل به نام display_item.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" >
<ImageView
android:id="@+id/imageView1"
android:layout_width="200dp"
android:layout_height="200dp"
android:layout_centerHorizontal="true" />
<TextView
android:id="@+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_below="@+id/imageView1"
android:textColor="#FFFFFF"
android:layout_centerHorizontal="true"
android:layout_marginTop="5dp" />
</RelativeLayout>
شکل ظاهری هر کدام از StackView ها توسط کد بالا ایجاد می شود.
حالا یک فایل به نام Stack_Items.java ایجاد کرده و کد های زیر را در آن قرار دهید.
package ir.programchi;
public class Stack_Items {
String name;
Integer image;
public Stack_Items(String name, Integer image) {
this.name = name;
this.image = image;
}
public String getName() {
return name;
}
public int getImage() {
return image;
}
}
به این کلاس getter و setter میگن.
حالا زمان ایجاد آداپتور است یک فایل جاوا به نام Stack_Adapter.java ایجاد کرده و کد های زیر را در آن قرار دهید.
package ir.programchi;
import java.util.ArrayList;
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 Stack_Adapter extends BaseAdapter {
ArrayList<Stack_Items> arrayList;
LayoutInflater inflater;
ViewHolder holder = null;
public Stack_Adapter(Context context, ArrayList<Stack_Items> arrayList) {
this.arrayList = arrayList;
this.inflater = LayoutInflater.from(context);
}
@Override
public int getCount() {
// TODO Auto-generated method stub
return arrayList.size();
}
@Override
public Stack_Items getItem(int pos) {
// TODO Auto-generated method stub
return arrayList.get(pos);
}
@Override
public long getItemId(int pos) {
// TODO Auto-generated method stub
return pos;
}
@Override
public View getView(int pos, View view, ViewGroup parent) {
if (view == null) {
view = inflater.inflate(R.layout.display_item, parent, false);
holder = new ViewHolder();
holder.text = (TextView) view.findViewById(R.id.textView1);
holder.image = (ImageView) view.findViewById(R.id.imageView1);
view.setTag(holder);
} else {
holder = (ViewHolder) view.getTag();
}
holder.text.setText(arrayList.get(pos).getName());
holder.image.setBackgroundResource(arrayList.get(pos).getImage());
return view;
}
public class ViewHolder {
TextView text;
ImageView image;
}
}
و در آخر کد مربوط به MainActivity.java همانند زیر می شود.
38
package com.android_stackview_demo;
import java.util.ArrayList;
import android.support.v7.app.ActionBarActivity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.widget.StackView;
public class MainActivity extends ActionBarActivity {
private static StackView stackView;
private static ArrayList<Stack_Items> list;
private static final Integer[] icons = { R.drawable.a, R.drawable.b,
R.drawable.c, R.drawable.d };
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
stackView = (StackView) findViewById(R.id.stackView1);
list = new ArrayList<Stack_Items>();
for (int i = 0; i < icons.length; i++) {
list.add(new Stack_Items("Item " + i, icons[i]));
}
Stack_Adapter adapter = new Stack_Adapter(MainActivity.this, list);
stackView.setAdapter(adapter);
adapter.notifyDataSetChanged();
}
}
در بالا شما باید 4 تا عکس به نام a,b,c,d در پوشه drawable خودتان داشته باشید. و سپس به سادگی با استفاده از یک آرایه و آداپتوری که درست کردیم داده ها را در satckView قرار می دهیم.
این آموزش هم به پایان رسید.
موفق و موید باشید.
