नीचे डॉट्स के साथ Android ViewPager


183

मैं इस तरह अपने ViewPager में 3 नीचे डॉट्स जोड़ना चाहता हूं।

3 नीचे डॉट्स 3 नीचे डॉट्स 3 नीचे डॉट्स

मैं FragmentActivity का उपयोग करता हूं और लाइब्रेरी ViewPager का समर्थन करता हूं।


3
मुझे डॉट्स जोड़ने की जरूरत है, न कि टैब (जैसे नेक्सस 5 लॉन्चर) की।
काफिर गाय

1
मेरे समाधान की जाँच करें: stackoverflow.com/a/38459310/4631935
RediOne1

जवाबों:


356

इसके लिए ज्यादा कोड की जरूरत नहीं है।

तुम बहुत ही का उपयोग करके ऐसा कोडिंग के बिना यह सब सामान कर सकते हैं viewpagerसाथtablayout

आपका मुख्य लेआउट:

<RelativeLayout
   xmlns:android="http://schemas.android.com/apk/res/android"
   xmlns:app="http://schemas.android.com/apk/res-auto"
   android:layout_width="match_parent"
   android:layout_height="wrap_content">

   <android.support.v4.view.ViewPager
       android:id="@+id/pager"
       android:layout_width="match_parent"
       android:layout_height="match_parent">

   </android.support.v4.view.ViewPager>
   <android.support.design.widget.TabLayout
       android:id="@+id/tabDots"
       android:layout_alignParentBottom="true"
       android:layout_width="match_parent"
       android:layout_height="wrap_content"
       app:tabBackground="@drawable/tab_selector"
       app:tabGravity="center"
       app:tabIndicatorHeight="0dp"/>
</RelativeLayout>

अपने UI तत्वों की निष्क्रियता या टुकड़े को निम्नानुसार हुक करें:

जावा कोड:

mImageViewPager = (ViewPager) findViewById(R.id.pager);
TabLayout tabLayout = (TabLayout) findViewById(R.id.tabDots);
tabLayout.setupWithViewPager(mImageViewPager, true);

यही है, आप जाने के लिए अच्छे हैं।

आपको ड्रा करने योग्य फ़ोल्डर में निम्न xml संसाधन फ़ाइल बनाने की आवश्यकता होगी ।

tab_indicator_selected.xml

<?xml version="1.0" encoding="utf-8"?>
<shape
    android:innerRadius="0dp"
    android:shape="oval"
    android:thickness="4dp"
    android:useLevel="false"
    xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="@color/colorAccent"/>
</shape>

tab_indicator_default.xml

<?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android"
            android:innerRadius="0dp"
            android:shape="oval"
            android:thickness="2dp"
            android:useLevel="false">
            <solid android:color="@android:color/darker_gray"/>
    </shape>

tab_selector.xml

 <?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:drawable="@drawable/tab_indicator_selected"
          android:state_selected="true"/>

    <item android:drawable="@drawable/tab_indicator_default"/>
</selector>

मैं के रूप में आलसी महसूस कर रहा हूँ? खैर, उपरोक्त सभी कोड एक पुस्तकालय में परिवर्तित हो गया है! उपयोगimplementation 'com.chabbal:slidingdotsplash:1.0.2' को अपनी श्रेणी में निम्न जोड़ें : अपनी गतिविधि या खंड लेआउट में निम्न जोड़ें।

<com.chabbal.slidingdotsplash.SlidingSplashView
        android:id="@+id/splash"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:imageResources="@array/img_id_arr"/>

strings.xmlउदाहरण के लिए एक पूर्णांक सरणी बनाएँ

<integer-array name="img_id_arr">
   <item>@drawable/img1</item>
   <item>@drawable/img2</item>
   <item>@drawable/img3</item>
   <item>@drawable/img4</item>
</integer-array>

किया हुआ! पृष्ठ परिवर्तन सुनने के लिए अतिरिक्तaddOnPageChangeListener(listener); Github लिंक का उपयोग करें


3
प्रश्न पूछने से पहले ही मैं अप-डाउन कर चुका था, क्योंकि इसने पहले ही मेरी बहुत मदद की थी, लेकिन अब मेरी इच्छा है कि मैं +2 या +100 :) को अपवोट कर सकूं क्योंकि onPageChangeListener को जोड़ने से मेरे लिए पूरी तरह से काम हुआ! और इसका उपयोग करने वाले किसी भी व्यक्ति के लिए यह स्पष्ट करने के लिए, आपको अपने अपडेट ऑनपेज सेलेक्टेड कॉलबैक पर करने की आवश्यकता है, अपडेट को ऑनपेजेजक्रॉलड कॉलबैक में जोड़ने से यह गड़बड़ हो जाता है, जैसे ही आप स्क्रॉल करना शुरू करते हैं, यह अपडेट शुरू हो जाता है, जो नहीं है नेत्रहीन अच्छा!
मोहम्मद हमदौई

1
हमें TabLayout की आवश्यकता क्यों है?
विंकलार्र

13
आप com.google.android.material.tabs.TabLayoutनए संस्करणों में उपयोग करना चाहते हैं
विद्वान

2
अपडेट: जो काम करता है लेकिन आपको नए घटकों का उपयोग करना चाहिए: androidx.viewpager.widget.ViewPager और com.google.android.material.tabs.TabLayout
dreinoso

2
उपरोक्त ड्रा करने योग्य XML अजीब दिखता है जब तक कि मैंने आकार नहीं बदला ring। अंडाकार के बजाय स्लाइडडिंगशॉटप्लाश लाइब्रेरी में भी अंगूठी की तरह उपयोग किया जाता है।
केटी

39

मेरा हस्तनिर्मित समाधान:

लेआउट में:

<LinearLayout
        android:orientation="horizontal"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/dots"
        />

और एक्टिविटी में

private final static int NUM_PAGES = 5;
private ViewPager mViewPager;
private List<ImageView> dots;

@Override
protected void onCreate(Bundle savedInstanceState) {
    // ...
    addDots();
}

public void addDots() {
    dots = new ArrayList<>();
    LinearLayout dotsLayout = (LinearLayout)findViewById(R.id.dots);

    for(int i = 0; i < NUM_PAGES; i++) {
        ImageView dot = new ImageView(this);
        dot.setImageDrawable(getResources().getDrawable(R.drawable.pager_dot_not_selected));

        LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(
                LinearLayout.LayoutParams.WRAP_CONTENT,
                LinearLayout.LayoutParams.WRAP_CONTENT
        );
        dotsLayout.addView(dot, params);

        dots.add(dot);
    }

    mViewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {
        @Override
        public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
        }

        @Override
        public void onPageSelected(int position) {
            selectDot(position);
        }

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

public void selectDot(int idx) {
    Resources res = getResources();
    for(int i = 0; i < NUM_PAGES; i++) {
        int drawableId = (i==idx)?(R.drawable.pager_dot_selected):(R.drawable.pager_dot_not_selected);
        Drawable drawable = res.getDrawable(drawableId);
        dots.get(i).setImageDrawable(drawable);
    }
}

3
Layoutसिर्फ डॉट लगाने के लिए भारी कंपोनेंट का उपयोग क्यों करें ? Viewइसके बजाय उपयोग करें ।
अपूर्वा

2
मुझे लगता है कि रैखिक लेआउट इतना है कि यह डॉट्स को केंद्र और समूहित करेगा।
शाव्नव

38
viewPager.addOnPageChangeListener(new OnPageChangeListener() {
            @Override
            public void onPageSelected(int position) {

                switch (position) {
    case 0:
        img_page1.setImageResource(R.drawable.dot_selected);
        img_page2.setImageResource(R.drawable.dot);
        img_page3.setImageResource(R.drawable.dot);
        img_page4.setImageResource(R.drawable.dot);
        break;

    case 1:
        img_page1.setImageResource(R.drawable.dot);
        img_page2.setImageResource(R.drawable.dot_selected);
        img_page3.setImageResource(R.drawable.dot);
        img_page4.setImageResource(R.drawable.dot);
        break;

    case 2:
        img_page1.setImageResource(R.drawable.dot);
        img_page2.setImageResource(R.drawable.dot);
        img_page3.setImageResource(R.drawable.dot_selected);
        img_page4.setImageResource(R.drawable.dot);
        break;

    case 3:
        img_page1.setImageResource(R.drawable.dot);
        img_page2.setImageResource(R.drawable.dot);
        img_page3.setImageResource(R.drawable.dot);
        img_page4.setImageResource(R.drawable.dot_selected);
        break;

    default:
        break;
    }


            }

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

            }

            @Override
            public void onPageScrollStateChanged(int arg0) {

            }
        });

18
setOnPageChangedListener()पदावनत !! addOnPageChangedListener()अब उपयोग करें ।
अपूर्वा

12
यह वास्तव में एक महान समाधान नहीं है, क्योंकि आपको यह जानना होगा कि आप कितने पृष्ठों का उपयोग कर रहे हैं। जैसे ही आप कोई पृष्ठ जोड़ते या हटाते हैं, आप मुसीबत में पड़ जाते हैं।
फ्रॉस्टरकेट

3
ढांचे से मत लड़ो। Android के पास TabLayout के रूप में ऐसा करने के लिए उपकरण हैं, पहिया को फिर से स्थापित करने का कोई कारण नहीं है।
केके

3
इसे सरल करें: निजी शून्य सेटडॉटसेलेक्शन (इंट इंडेक्स) {dot1.setImageResource (index == 0; R.drawable.circle_selected: R.drawable.circle); dot2.setImageResource (index == 1; R.drawable.circle_selected: R.drawable.circle); dot3.setImageResource (index == 2; R.drawable.circle_selected: R.drawable.circle); dot4.setImageResource (index == 3; R.drawable.circle_selected: R.drawable.circle); dot5.setImageResource (index == 4; R.drawable.circle_selected: R.drawable.circle); }
दूना

31

मैंने एक ViewPager में एक पृष्ठ संकेतक की आवश्यकता को संबोधित करने के लिए एक पुस्तकालय बनाया। मेरे पुस्तकालय में DotIndicator नामक एक दृश्य है। मेरे पुस्तकालय का उपयोग करने के लिए, जोड़ेंcompile 'com.matthew-tamlin:sliding-intro-screen:3.2.0' अपने ग्रेडल बिल्ड फ़ाइल में ।

निम्नलिखित को जोड़कर दृश्य को आपके लेआउट में जोड़ा जा सकता है:

    <com.matthewtamlin.sliding_intro_screen_library.indicators.DotIndicator
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:numberOfDots=YOUR_INT_HERE
            app:selectedDotIndex=YOUR_INT_HERE/>

उपरोक्त कोड Google लॉन्चर होमस्क्रीन पर डॉट्स की कार्यक्षमता को पूरी तरह से दोहराता है, हालाँकि यदि आप इसे और कस्टमाइज़ करना चाहते हैं तो निम्नलिखित विशेषताएँ जोड़ी जा सकती हैं:

  • app:unselectedDotDiameterऔर app:selectedDotDiameterडॉट्स के व्यास निर्धारित करने के लिए
  • app:unselectedDotColorऔर app:selectedDotColorडॉट्स के रंग सेट करने के लिए
  • app:spacingBetweenDots डॉट्स के बीच की दूरी को बदलने के लिए
  • app:dotTransitionDuration छोटे से बड़े (और पीछे) परिवर्तन को एनिमेट करने का समय निर्धारित करने के लिए

इसके अतिरिक्त, दृश्य का उपयोग करके प्रोग्राम बनाया जा सकता है:

DotIndicator indicator = new DotIndicator(context);

गुण के समान गुणों को संशोधित करने के लिए तरीके मौजूद हैं। चयनित पृष्ठ के रूप में एक अलग पृष्ठ दिखाने के लिए संकेतक को अपडेट करने के लिए, बस indicator.setSelectedItem(int, true)अंदर से विधि को कॉल करेंViewPager.OnPageChangeListener.onPageSelected(int)

यहाँ इसका एक उदाहरण प्रयोग में है:

यहां छवि विवरण दर्ज करें

यदि आप रुचि रखते हैं, तो पुस्तकालय वास्तव में इंट्रो स्क्रीन बनाने के लिए डिज़ाइन किया गया था जैसा कि ऊपर दिए गए जीआईएफ में दिखाया गया है।

Github स्रोत यहां उपलब्ध है: https://github.com/MatthewTamlin/SlidingIntroScreen


संकेतक पर त्रुटि मिली ।सेटलेक्टेड इटेम (स्थिति, सत्य); IndexOutOfBoundsException
दीक्षित पांचाल

कौन सा संस्करण? मैंने सोचा था कि मैंने 3.0.1 में यह भी तय किया था कि संकेतक (आकार) और स्थिति के लिए आपके मूल्य क्या हैं?
हेलियोस

महान पुस्तकालय! हालांकि, एक ही समय में चयनित इटेम और नंबरऑफइम्स को अपडेट करने का एक और अधिक सुरुचिपूर्ण तरीका है? जिसके आधार पर कोई बड़ा होता है, क्रम बदलता है, अन्यथा आप एक IndexOutOfBounds अपवाद को फेंक देते हैं। देखें इस सार
vsp

@vsp DotIndicator SelectionIndicator इंटरफ़ेस को लागू करता है, जिसका अर्थ है कि अगर दो उपयोगी तरीके हैं जो आपकी समस्या को हल कर सकते हैं: int getNumberOfItems()और void setNumberOfItems()। अपवाद को पकड़ने के बजाय, आप ऐसा कुछ कर सकते हैं जैसे gist.github.com/MatthewTamlin/761c7338d271af29526edc7859480aef
हेलिओस

जिस्ट वार्तालाप का पालन नहीं करने वाले किसी व्यक्ति के लिए, वास्तव में एक बग था जिसे अब ठीक कर दिया गया है। 3.0.2 अभी के रूप में नवीनतम संस्करण है।
हेलिओस

18

ViewPagerIndicator 2012 के बाद से अद्यतन नहीं किया गया है और कई कीड़े मिले जो कभी भी तय नहीं किए गए थे।

अंत में मुझे इस लाइट लाइब्रेरी के साथ एक विकल्प मिला, जो इसके लिए अच्छे डॉट्स प्रदर्शित करता है viewpager, यहाँ लिंक है:

https://github.com/ongakuer/CircleIndicator

लागू करने के लिए आसान!


16

मैंने उपरोक्त समस्या के लिए एक सरल समाधान पोस्ट करने के बारे में सोचा और संकेतक संख्याओं को गतिशील रूप से केवल एक चर मान के साथ बदल दिया जा सकता है dotCounts=xजो मैंने इस तरह से किया था।

1) "item_selected" नामक पृष्ठ चयनित संकेतक के लिए ड्रा करने योग्य फ़ोल्डर में एक xml फ़ाइल बनाएं।

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval" android:useLevel="true"
    android:dither="true">
    <size android:height="8dp" android:width="8dp"/>
    <solid android:color="@color/image_item_selected_for_dots"/>
</shape>

2) अचयनित संकेतक के लिए एक और xml फ़ाइल बनाएं जिसका नाम "item_unselected" है।

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval" android:useLevel="true"
    android:dither="true">

    <size android:height="8dp" android:width="8dp"/>

    <solid android:color="@color/image_item_unselected_for_dots"/>
</shape>

3) अब कोड के इस हिस्से को उस स्थान पर जोड़ें जहां आप नीचे के लिए संकेतक प्रदर्शित करना चाहते हैं viewPager अपने लेआउट XML फ़ाइल में ।

 <RelativeLayout
        android:id="@+id/viewPagerIndicator"
        android:layout_width="match_parent"
        android:layout_below="@+id/banner_pager"
        android:layout_height="wrap_content"
        android:gravity="center">

        <LinearLayout
            android:id="@+id/viewPagerCountDots"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_centerHorizontal="true"
            android:gravity="center"
            android:orientation="horizontal" />
        </RelativeLayout>

4) इस फ़ंक्शन को अपनी गतिविधि फ़ाइल फ़ाइल के शीर्ष पर जोड़ें जहां आपका लेआउट फुलाया गया है या उपरोक्त xml फ़ाइल संबंधित है

private int dotsCount=5;    //No of tabs or images
private ImageView[] dots;
LinearLayout linearLayout;

private void drawPageSelectionIndicators(int mPosition){
    if(linearLayout!=null) {
        linearLayout.removeAllViews();
    }
    linearLayout=(LinearLayout)findViewById(R.id.viewPagerCountDots);
    dots = new ImageView[dotsCount];
    for (int i = 0; i < dotsCount; i++) {
        dots[i] = new ImageView(context);
        if(i==mPosition)
            dots[i].setImageDrawable(getResources().getDrawable(R.drawable.item_selected));
        else
            dots[i].setImageDrawable(getResources().getDrawable(R.drawable.item_unselected));

        LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(
                LinearLayout.LayoutParams.WRAP_CONTENT,
                LinearLayout.LayoutParams.WRAP_CONTENT
        );

        params.setMargins(4, 0, 4, 0);
        linearLayout.addView(dots[i], params);
    }
}

5) अंत में अपने onCreate मेथड में अपने लेआउट को रेफ़र करने के लिए और कोड को पजेसलेटेड पोजिशन को संभालने के लिए निम्न कोड जोड़ें

drawPageSelectionIndicators(0);
mPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
    @Override
    public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
    }

    @Override
    public void onPageSelected(int position) {
        drawPageSelectionIndicators(position);
    }

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

13

आप जेक व्हार्टन की लाइब्रेरी की कोशिश कर सकते हैं - https://github.com/JakeWharton/Android-ViewPagerbndator


मैं डॉट्स कैसे जोड़ सकता हूं, टैब नहीं (जैसे नेक्सस 5 लॉन्चर)?
काफिर गाय

@KfirGuy वे संकेतक के रूप में संदर्भित होते हैं। आप इसे ऊपर बताए गए पुस्तकालय का उपयोग करके कर सकते हैं। इसके अलावा, आप इसे यहां एक्शन में देख सकते हैं - play.google.com/store/apps/…
जोएल फर्नांडिस

@JoelFernandes ऐसा लगता है कि यह ऐप सभी देशों में उपलब्ध नहीं है
34m0

9

निम्नलिखित मेरा प्रस्तावित समाधान है।

  • चूँकि हमें व्यू पेजर्स में केवल कुछ चित्र दिखाने की आवश्यकता है, इसलिए टुकड़ों के बोझिल उपयोग से बचा जाता है।
    • दृश्य पृष्ठ संकेतक (किसी अतिरिक्त लाइब्रेरी या प्लगइन के बिना नीचे डॉट्स) को लागू किया गया
    • दृश्य पृष्ठ संकेतक (डॉट्स) के स्पर्श पर भी पृष्ठ नेविगेशन हो रहा है।
    • कृपया अपने संसाधनों में अपनी छवियों को जोड़ना न भूलें।
    • बेझिझक टिप्पणी करें और उस पर सुधार करें।

ए) के बाद मेरी गतिविधि_मैं.एक्सएमएल है

<?xml version="1.0" encoding="utf-8"?>
<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"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="schneider.carouseladventure.MainActivity">

    <android.support.v4.view.ViewPager xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/viewpager"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

    <RelativeLayout
        android:id="@+id/viewPagerIndicator"
        android:layout_width="match_parent"
        android:layout_height="55dp"
        android:layout_alignParentBottom="true"
        android:layout_marginTop="5dp"
        android:gravity="center">

        <LinearLayout
            android:id="@+id/viewPagerCountDots"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_centerHorizontal="true"
            android:gravity="center"
            android:orientation="horizontal" />

    </RelativeLayout>


</RelativeLayout>

बी) पेजर_इटेम.एक्सएमएल

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/imageView" />
</LinearLayout>

ग) MainActivity.java

import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.MotionEvent;
import android.view.View;
import android.widget.ImageButton;
import android.widget.ImageView;
import android.widget.LinearLayout;

public class MainActivity extends AppCompatActivity implements ViewPager.OnPageChangeListener, View.OnClickListener {

    int[] mResources = {R.drawable.nature1, R.drawable.nature2, R.drawable.nature3, R.drawable.nature4,
            R.drawable.nature5, R.drawable.nature6
    };

    ViewPager mViewPager;
    private CustomPagerAdapter mAdapter;
    private LinearLayout pager_indicator;
    private int dotsCount;
    private ImageView[] dots;


    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        mViewPager = (ViewPager) findViewById(R.id.viewpager);
        pager_indicator = (LinearLayout) findViewById(R.id.viewPagerCountDots);
        mAdapter = new CustomPagerAdapter(this, mResources);
        mViewPager.setAdapter(mAdapter);
        mViewPager.setCurrentItem(0);
        mViewPager.setOnPageChangeListener(this);

        setPageViewIndicator();

    }

    private void setPageViewIndicator() {

        Log.d("###setPageViewIndicator", " : called");
        dotsCount = mAdapter.getCount();
        dots = new ImageView[dotsCount];

        for (int i = 0; i < dotsCount; i++) {
            dots[i] = new ImageView(this);
            dots[i].setImageDrawable(getResources().getDrawable(R.drawable.nonselecteditem_dot));

            LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(
                    LinearLayout.LayoutParams.WRAP_CONTENT,
                    LinearLayout.LayoutParams.WRAP_CONTENT
            );

            params.setMargins(4, 0, 4, 0);

            final int presentPosition = i;
            dots[presentPosition].setOnTouchListener(new View.OnTouchListener() {

                @Override
                public boolean onTouch(View v, MotionEvent event) {
                    mViewPager.setCurrentItem(presentPosition);
                    return true;
                }

            });


            pager_indicator.addView(dots[i], params);
        }

        dots[0].setImageDrawable(getResources().getDrawable(R.drawable.selecteditem_dot));
    }

    @Override
    public void onClick(View v) {

    }

    @Override
    public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

    }

    @Override
    public void onPageSelected(int position) {

        Log.d("###onPageSelected, pos ", String.valueOf(position));
        for (int i = 0; i < dotsCount; i++) {
            dots[i].setImageDrawable(getResources().getDrawable(R.drawable.nonselecteditem_dot));
        }

        dots[position].setImageDrawable(getResources().getDrawable(R.drawable.selecteditem_dot));

        if (position + 1 == dotsCount) {

        } else {

        }
    }

    @Override
    public void onPageScrollStateChanged(int state) {

    }
}

डी) CustomPagerAdapter.java

 import android.content.Context;
    import android.support.v4.view.PagerAdapter;
    import android.view.LayoutInflater;
    import android.view.View;
    import android.view.ViewGroup;
    import android.widget.ImageView;
    import android.widget.LinearLayout;

    public class CustomPagerAdapter extends PagerAdapter {
        private Context mContext;
        LayoutInflater mLayoutInflater;
        private int[] mResources;

        public CustomPagerAdapter(Context context, int[] resources) {
            mContext = context;
            mLayoutInflater = (LayoutInflater) mContext.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
            mResources = resources;
        }

        @Override
        public Object instantiateItem(ViewGroup container, int position) {

            View itemView = mLayoutInflater.inflate(R.layout.pager_item,container,false);
            ImageView imageView = (ImageView) itemView.findViewById(R.id.imageView);
            imageView.setImageResource(mResources[position]);
           /* LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(950, 950);
            imageView.setLayoutParams(layoutParams);*/
            container.addView(itemView);
            return itemView;
        }

        @Override
        public void destroyItem(ViewGroup collection, int position, Object view) {
            collection.removeView((View) view);
        }

        @Override
        public int getCount() {
            return mResources.length;
        }

        @Override
        public boolean isViewFromObject(View view, Object object) {
            return view == object;
        }
    }

ई) सेलेमिटेम_डॉट.एक्सएमएल

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval" android:useLevel="true"
    android:dither="true">

    <size android:height="12dip" android:width="12dip"/>

    <solid android:color="#7e7e7e"/>
</shape>

एफ) नॉनसेलेडिटेम_डॉट.एक्सएमएल

 <?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape="oval" android:useLevel="true"
        android:dither="true">        
        <size android:height="12dip" android:width="12dip"/>        
        <solid android:color="#d3d3d3"/>
    </shape>

पहली छवि

यहां छवि विवरण दर्ज करें


मैंने इसका इस्तेमाल किया, लेकिन व्यूपेजर स्क्रॉल डॉट्स में बदलाव नहीं हुआ है
आदित्य व्यास-लखन

1
यह सबसे अच्छा जवाब है।
संदीप लोंढे

1

अगर कोई भी viewPagerसंकेतक के रूप में थंबनेल के साथ निर्माण करना चाहता है , तो इस लाइब्रेरी का उपयोग करना एक विकल्प हो सकता है: ThumbIndicator for viewPager जो संसाधनों के रूप में छवि लिंक के साथ भी काम करता है।


0

यहाँ है कि मैंने ऐसा कैसे किया, ऊपर दिए गए समाधानों के समान। बस सुनिश्चित करें कि आप सभी चित्रों के डाउनलोड होने के बाद लोडडॉट्स () विधि को कॉल करते हैं

    private int dotsCount;
    private TextView dotsTextView[];

    private void setupAdapter() {
        adapter = new SomeAdapter(getContext(), images);
        viewPager.setAdapter(adapter);
        viewPager.setCurrentItem(0);
        viewPager.addOnPageChangeListener(viewPagerPageChangeListener);
    }

    private final ViewPager.OnPageChangeListener viewPagerPageChangeListener = new ViewPager.OnPageChangeListener() {
        @Override
        public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {}

        @Override
        public void onPageSelected(int position) {
            for (int i = 0; i < dotsCount; i++)
                dotsTextView[i].setTextColor(Color.GRAY);

            dotsTextView[position].setTextColor(Color.WHITE);
        }

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

    protected void loadDots() {
        dotsCount = adapter.getCount();
        dotsTextView = new TextView[dotsCount];
        for (int i = 0; i < dotsCount; i++) {
            dotsTextView[i] = new TextView(getContext());
            dotsTextView[i].setText(R.string.dot);
            dotsTextView[i].setTextSize(45);
            dotsTextView[i].setTypeface(null, Typeface.BOLD);
            dotsTextView[i].setTextColor(android.graphics.Color.GRAY);
            mDotsLayout.addView(dotsTextView[i]);
        }
        dotsTextView[0].setTextColor(Color.WHITE);
    }

XML

<?xml version="1.0" encoding="utf-8"?>

<FrameLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <android.support.v4.view.ViewPager
        android:id="@+id/viewPager"
        android:layout_width="match_parent"
        android:layout_height="180dp"
        android:background="#00000000"/>


    <ImageView
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/introImageView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>

    <LinearLayout
        android:id="@+id/image_count"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#00000000"
        android:gravity="center|bottom"
        android:orientation="horizontal"/>
</FrameLayout>
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.