Статьи

Android: просмотр галереи без картинок

Android Gallery View — один из первых созданных Android виджетов. Он так стар, что некоторым людям даже трудно его найти .

Представление «Галерея» предоставляет список прокручиваемых объектов, очень похожих на стандартный ListView . Одним из основных преимуществ использования галереи является ее функция привязки к положению. Когда пользователь прекращает прокрутку, изображения, которые в конечном итоге отображаются, также привязываются к центру экрана. Это означает, что пользователь не будет смотреть на половину двух отдельных изображений одновременно, и как разработчик вы также точно знаете, на чем сосредоточен пользователь. Кроме того, представление «Галерея» работает очень хорошо в горизонтальном режиме, а не в вертикальном режиме, как стандартный ListView.

Приятной особенностью просмотра галереи является то, что она может использоваться с любым типом представления, о котором вы только можете подумать, а не только с изображениями. Создавая собственный макет с тем, что вы хотели бы отображать в представлении галереи, вы можете придумать несколько довольно интересных дисплеев.

Создать собственное представление и добавить его в представление галереи довольно просто. Вот быстрый пример, который отображает горизонтальный вид галереи с CheckBox слева, TextView в центре и ImageView справа.

Для начала, мы просто создаем новый проект Android (уровень API не имеет значения, это должно работать в любой версии). В main.xml (который является файлом макета проекта по умолчанию), мы добавляем Галерею и удаляем TextView по умолчанию следующим образом:

1
2
3
4
<?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>

Теперь, когда у нас есть виджет Галерея в нашем проекте, давайте продолжим и создадим макет элемента галереи. Этот макет точно показывает, как будет выглядеть каждый элемент в представлении галереи. Как я уже говорил выше, мы хотим, чтобы CheckBox был заблокирован слева, TextView в центре и ImageView заблокирован справа. Кроме того, было бы неплохо добавить отступы на правой и левой сторонах, чтобы мы могли видеть все хорошо. Чтобы получить желаемый вид, используется RelativeLayout:

1
2
3
4
5
6
<?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/textView" 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/imageView" android:src="@drawable/icon" android:layout_height="wrap_content" android:layout_alignParentTop="true" android:layout_alignParentRight="true" android:layout_marginRight="22dp"></ImageView>
    <CheckBox android:id="@+id/checkBox" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentTop="true" android:layout_alignParentLeft="true" android:layout_marginLeft="24dp"></CheckBox
</RelativeLayout>

Теперь, когда все макеты готовы к работе, все, что нам нужно сделать, это настроить наш адаптер галереи. В этом случае представление галереи немного отличается от стандартного представления ListView. Чтобы получить пользовательский макет, BaseAdapter должен быть расширен для предоставления пользовательского представления. Поэтому мы назовем новый пользовательский адаптер newGalleryAdapter. Мы просто поместим адаптер в нижней части нашей деятельности. Вот как выглядит наша активность сейчас:

01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
public class GalleryExampleActivity extends Activity {
     
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        // Find our gallery view and set the adapter for it
        Gallery gallery = (Gallery) findViewById(R.id.gallery);
        gallery.setAdapter(new newGalleryAdapter(this));
    }
 
    // The new custom Gallery Adapter for our new layout
 
    private class newGalleryAdapter extends BaseAdapter {
        private Context context; // needed to create the view
 
        public newGalleryAdapter(Context c) {
            Context = c;
        }
 
        // set to three for this example
        // for normal use this should be set to the length of the data
        // structure that contains the items to be displayed
        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 v;
 
            // just a simple optimiztaion -
            // we only inflate a new layout if we don't have one to reuse
 
            if (convertView == null)
                v = LayoutInflater.from(context).inflate(R.layout.gallery_item,
                    parent, false);
            else
                v = convertView;
             
            // Now that we have our new custom View, find out widgets in the
            // view and set them
            TextView tv = (TextView) v.findViewById(R.id.textView);
 
            tv.setText(String.valueOf(position));
            CheckBox cb = (CheckBox) v.findViewById(R.id.checkBox);
             
            // this just alternates what the checkbox states are
            if (position % 2 == 0)
                cb.setChecked(true);
            else
                cb.setChecked(false);
            return v;
 
        }
 
    }
 
}

В onCreate мы просто находим наш просмотр галереи и устанавливаем его адаптер на наш новый адаптер. На линии 14 и ниже мы проектируем наш новый адаптер. Наиболее важным методом в классе адаптера является метод getView (строка 37). В этом методе наш новый пользовательский макет (gallery_item.xml) раздувается. Затем мы находим виджеты и устанавливаем их так, как нам нравится. Как только мы закончим настройку View, просто верните его.

Со всем сказано и сделано, мы получаем это:

Ссылка: руководство для Android: просмотр галереи без изображений от нашего партнера по JCG в блоге Programming Mobile .

Статьи по Теме :