Мне интересно, как добиться того, чтобы этот индикатор страницы стал популярным в приложениях, когда дело касается процесса настройки. Я знаю, что есть настраиваемое представление для индикатора страницы круга, но мне любопытно, есть ли лучшее решение без необходимости установки внешних библиотек?

Я хочу создать что-то вроде:

enter image description here

1
aambrozkiewicz 18 Мар 2014 в 14:49
Думаю, вам понадобится библиотека [viewpagerIndicator] ( github.com/JakeWharton/Android-ViewPagerIndicator). Если вы хотите скопировать код в библиотеку, вам нужно будет скопировать значения attrs. Вместо этого рекомендую выбрать саму библиотеку
 – 
NullPointerException
18 Мар 2014 в 14:54
Теперь я вижу внизу полосы, которые мне нужны. Спасибо
 – 
aambrozkiewicz
18 Мар 2014 в 15:26

1 ответ

Лучший ответ

Да, вы можете добиться этого с помощью окна просмотра по умолчанию для Android, просто добавьте один линейный макет выше окна просмотра, который содержит просмотр изображений. Чтобы указать выбранную страницу, вы можете использовать метод viewpager.onpagechangelistener. Ваш макет должен быть таким

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >    
<LinearLayout
            android:id="@+id/indicator_layout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_above="@+id/bottom_layout"
            android:background="#343434"
            android:gravity="center_horizontal"
            android:orientation="horizontal" >

           <ImageView
                android:id="@+id/dot1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_vertical"
                android:padding="5dp"
                android:src="@drawable/active_dot" 
                android:contentDescription="@string/indicator"/>

            <ImageView
                android:id="@+id/dot2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_vertical"
                android:padding="5dp"
                android:src="@drawable/inactive_dot" 
                android:contentDescription="@string/indicator"/>

            <ImageView
                android:id="@+id/dot3"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_vertical"
                android:padding="5dp"
                android:src="@drawable/inactive_dot" 
                android:contentDescription="@string/indicator"/>

            <ImageView
                android:id="@+id/dot4"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_vertical"
                android:padding="5dp"
                android:src="@drawable/inactive_dot" 
                android:contentDescription="@string/indicator"/>

            <ImageView
                android:id="@+id/dot5"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_vertical"
                android:padding="5dp"
                android:src="@drawable/inactive_dot" 
                android:contentDescription="@string/indicator"/>

            <ImageView
                android:id="@+id/dot6"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_vertical"
                android:padding="5dp"
                android:src="@drawable/inactive_dot" 
                android:contentDescription="@string/indicator"/>

        </LinearLayout>
       <android.support.v4.view.ViewPager
            android:id="@+id/mypager"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_below="@+id/indicator_layout" />
</RelativeLayout>

И ваш слушатель смены страниц должен быть таким

viewpager.setOnPageChangeListener(new OnPageChangeListener() {

        @Override
        public void onPageSelected(int which) {
            switch (which) {
            case 0:
                setIndicatorImage(dot1);
                break;

            case 1:
                setIndicatorImage(dot2);
                break;

            case 2:
                setIndicatorImage(dot3);
                break;

            case 3:
                setIndicatorImage(dot4);
                break;

            case 4:
                setIndicatorImage(dot5);
                break;

            case 5:
                setIndicatorImage(dot6);
                break;

            }
        }

        @Override
        public void onPageScrolled(int arg0, float arg1, int arg2) {
        }

        @Override
        public void onPageScrollStateChanged(int arg0) {
        }
    });
}

public void setIndicatorImage(ImageView selected_img) {
    if (selected_img.getId() == R.id.dot1) {
        dot1.setImageResource(R.drawable.active_dot);
        dot2.setImageResource(R.drawable.inactive_dot);
        dot3.setImageResource(R.drawable.inactive_dot);
        dot4.setImageResource(R.drawable.inactive_dot);
        dot5.setImageResource(R.drawable.inactive_dot);
        dot6.setImageResource(R.drawable.inactive_dot);
    } else if (selected_img.getId() == R.id.dot2) {
        dot1.setImageResource(R.drawable.inactive_dot);
        dot2.setImageResource(R.drawable.active_dot);
        dot3.setImageResource(R.drawable.inactive_dot);
        dot4.setImageResource(R.drawable.inactive_dot);
        dot5.setImageResource(R.drawable.inactive_dot);
        dot6.setImageResource(R.drawable.inactive_dot);
    } else if (selected_img.getId() == R.id.dot3) {
        dot1.setImageResource(R.drawable.inactive_dot);
        dot2.setImageResource(R.drawable.inactive_dot);
        dot3.setImageResource(R.drawable.active_dot);
        dot4.setImageResource(R.drawable.inactive_dot);
        dot5.setImageResource(R.drawable.inactive_dot);
        dot6.setImageResource(R.drawable.inactive_dot);
    } else if (selected_img.getId() == R.id.dot4) {
        dot1.setImageResource(R.drawable.inactive_dot);
        dot2.setImageResource(R.drawable.inactive_dot);
        dot3.setImageResource(R.drawable.inactive_dot);
        dot4.setImageResource(R.drawable.active_dot);
        dot5.setImageResource(R.drawable.inactive_dot);
        dot6.setImageResource(R.drawable.inactive_dot);
    } else if (selected_img.getId() == R.id.dot5) {
        dot1.setImageResource(R.drawable.inactive_dot);
        dot2.setImageResource(R.drawable.inactive_dot);
        dot3.setImageResource(R.drawable.inactive_dot);
        dot4.setImageResource(R.drawable.inactive_dot);
        dot5.setImageResource(R.drawable.active_dot);
        dot6.setImageResource(R.drawable.inactive_dot);
    } else{
        dot1.setImageResource(R.drawable.inactive_dot);
        dot2.setImageResource(R.drawable.inactive_dot);
        dot3.setImageResource(R.drawable.inactive_dot);
        dot4.setImageResource(R.drawable.inactive_dot);
        dot5.setImageResource(R.drawable.inactive_dot);
        dot6.setImageResource(R.drawable.active_dot);
    } 
}
0
Maulik.J 18 Мар 2014 в 16:35