Главная » Работаем с Gallery View | |
Одним из самых древних элементов интерфейса в Android приложениях можно назвать элемент по имени GallaryView. Он такой старый, что его почти никто не помнит, но мы сегодня с ним немного поработаем. В нем можно перелистывать и просматривать разные элементы, в том числе и другие view объекты, а не только изображения, как думают многие. В нашем примере, мы создадим приложение с GallaryView, в котором будет отображаться 3 самых разных объекта: TextView, CheckBox и ImageView. Между ними можно будет переключаться и производить перелистывание. Использование GallaryView довольно простое. Мы выполняем 3 основных шага: - создаем сам объект GallaryView; - создаем xml файл, отвечающий за вид элементом в галерее; - создаем для галереи адаптер Gallary Adapter, унаследованный от обычного BaseAdapter. Начнем. Создаем новый проект, выбираем Blank Activity. Сразу создадим объект GallaryView в файле activity_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">
<Gallery
android:id="@+id/gallery"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
</Gallery>
</LinearLayout>
Теперь создадим еще один layout файл, определяющий вид пунктов галереи. Создаем в папке layout файл под названием gallery_item.xml и добавляем в него следующее:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="@+id/gallery_item">
<TextView
android:id="@+id/tv"
android:layout_width="wrap_content"
android:text="TextView"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="14dp">
</TextView>
<ImageView
android:layout_width="wrap_content"
android:id="@+id/iv"
android:src="@drawable/ic_launcher"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignParentRight="true"
android:layout_marginRight="22dp">
</ImageView>
<CheckBox
android:id="@+id/chb"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_marginLeft="24dp">
</CheckBox>
</RelativeLayout>
Ну и последний пункт нашего сегодняшнего творения - создание нужного кода в файле MainActivity.java:
import android.app.Activity;
import android.content.Context;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.CheckBox;
import android.widget.Gallery;
import android.widget.TextView;
public class MainActivity extends Activity {
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// Связываемся с нашей галереей и устанавливаем ей адаптер:
Gallery gallery = (Gallery) findViewById(R.id.gallery);
gallery.setAdapter(new newGalleryAdapter(this));
}
// Создаем для галереи специальный адаптер:
private class newGalleryAdapter extends BaseAdapter {
private Context context;
public newGalleryAdapter(Context c) {context = c;
}
// Настраиваем на 3, будут отображены наши 3 элемента:
public int getCount() {
return 3;
}
public Object getItem(int position) {
return position;
}
public long getItemId(int position) {
return position;
}
public View getView(int position, View convertView, ViewGroup parent) {
View view;
// Настраиваем элементам галереи вид с файла gallery_item.xml:
if (convertView == null)
view = LayoutInflater.from(context).inflate(R.layout.gallery_item,parent, false);
else
view = convertView;
// Связываемся и настраиваем наши элементы интерфейса:
TextView tv = (TextView) view.findViewById(R.id.tv);
tv.setText(String.valueOf(position));
CheckBox chb = (CheckBox) view.findViewById(R.id.chb);
// При переключении в галерее будет меняться состояние переключателя вкл/выкл:
if (position % 2 == 0)
chb.setChecked(true);
else
chb.setChecked(false);
return view;
}
}
}
Мы создали и настроили необходимый для GallaryView адаптер прямо в этом же файле отдельным классом. Запускаем приложение и видим экран с тремя элементами: текст, переключатель и изображение, которые можно перелистывать, как обычные изображения. Да при этом еще и переключатель меняет свое состояние. Красота :). | |
|
Всего комментариев: 0 | |