নীচের বিন্দু সহ অ্যান্ড্রয়েড ভিউপাগার


183

আমি আমার ভিউপাগারে এই জাতীয় 3 টি ডট যুক্ত করতে চাই।

3 নীচের বিন্দু 3 নীচের বিন্দু 3 নীচের বিন্দু

আমি ফ্র্যাগমেন্টএটিভিটি এবং সমর্থন লাইব্রেরি ভিউপেজার ব্যবহার করি।


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); গিথুব লিঙ্কটি ব্যবহার করুন


3
প্রশ্ন জিজ্ঞাসার আগেই আমি ইতিমধ্যে upvated ছিল, কারণ এটি ইতিমধ্যে আমাকে অনেক সাহায্য করেছে, তবে এখন আমি আশা করি +2 বা +100 :) আমি আবেদন করতে পারি কারণ অন পেজ চ্যাঞ্জলিস্টনার যুক্ত করে আমার জন্য নিখুঁতভাবে কাজ করেছিল! এবং এটি যে কেউ ব্যবহার করতে পারে তার জন্য কেবল এটি পরিষ্কার করার জন্য, আপনাকে কেবলমাত্র পেজসিলিগ্রেটেড কলব্যাকের উপর নিজের আপডেটগুলি করতে হবে, অনপেজস্ক্রোলড কলব্যাকটিতে আপডেট যুক্ত করা অদৃশ্য করে তোলে, আপনি স্ক্রোলিং শুরু করার সাথে সাথেই আপডেটটি শুরু হয়, যা নয় দৃষ্টিভঙ্গি ভাল!
মোহাম্মদ হামদাউই

1
আমাদের কেন একটি ট্যাবলআউট দরকার?
উইঙ্কলারr

13
আপনি আরও com.google.android.material.tabs.TabLayoutনতুন সংস্করণে ব্যবহার করতে চান
স্ক্লেঞ্জার

2
আপডেট: এটি কাজ করে তবে আপনার নতুন উপাদানগুলি ব্যবহার করা উচিত: androidx.viewpager.widget.ViewPager এবং com.google.android.matory.tabs.TabLayout
dreinoso

2
উপরের অঙ্কনযোগ্য এক্সএমএলটি যতক্ষণ না আমি আকারে পরিবর্তন করেছি ততক্ষণ অদ্ভুত দেখাচ্ছে 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
কাঠামো লড়াই করবেন না। অ্যান্ড্রয়েডের ট্যাবলআউট হিসাবে এটি করার জন্য সরঞ্জাম রয়েছে, চাকাটি পুনরায় উদ্ভাবনের কোনও কারণ নেই।
কিক করুন

3
এটিকে সরল করুন: বেসরকারী শূন্য সেটডটসলেশন (ইনড ইনডেক্স) ot dot1.setImageResource (সূচক == 0? আর.ড্রেবলযোগ্য সার্কেল_নির্বাচিত: আর.ড্রেবলযোগ্য সার্কেল); dot2.setImageResource (সূচক == 1? আর.ড্রেবলযোগ্য। সার্কেল_নির্বাচিত: আর। dot3.setImageResource (সূচক == 2? আর.ড্রেবলযোগ্য। সার্কেল_নির্বাচিত: আর। dot4.setImageResource (সূচক == 3? আর.ড্রেবলযোগ্য। সার্কেল_নির্বাচিত: আর। dot5.setImageResource (সূচক == 4? আর.ড্রেবলযোগ্য। সার্কেল_নির্বাচিত: আর। }
ডুনা

31

আমি ভিউপ্যাজারে পৃষ্ঠা সূচকটির প্রয়োজনীয়তার জন্য একটি লাইব্রেরি তৈরি করেছি। আমার লাইব্রেরিতে ডট ইন্ডিকেটর নামে একটি ভিউ রয়েছে। আমার গ্রন্থাগারটি ব্যবহার 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/>

উপরের কোডটি গুগল লঞ্চার হোমস্ক্রিনে ডটগুলির কার্যকারিতাটির পুরোপুরি প্রতিলিপি দেয়, তবে আপনি যদি এটি আরও কাস্টমাইজ করতে চান তবে নিম্নলিখিত বৈশিষ্ট্যগুলি যুক্ত করা যেতে পারে:

  • 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)

এখানে এটি ব্যবহারের একটি উদাহরণ:

এখানে চিত্র বর্ণনা লিখুন

আপনি যদি আগ্রহী হন তবে লাইব্রেরিটি উপরের জিআইএফ-র মতো প্রদর্শিত ইন্ট্রো স্ক্রিনগুলি তৈরির জন্য তৈরি করা হয়েছিল।

গিথুব উত্স এখানে উপলভ্য: https://github.com


ইন্ডিকেটর.সেটসলেক্ট আইটেমে ত্রুটি পেয়েছে (অবস্থান, সত্য); সূচিপত্র ছাড়াই অনুভূতি
দীক্ষিত পঞ্চাল

কোন সংস্করণ? আমি ভেবেছিলাম আমি এটি 3.0.0 এ স্থির করেছি, এছাড়াও সূচক.সাইজ () এবং অবস্থানের জন্য আপনার মানগুলি কী ছিল?
হেলিওস

দুর্দান্ত গ্রন্থাগার! তবে, একই সাথে নির্বাচিত আইটেম এবং নম্বরঅফআইটিএমগুলি আপডেট করার জন্য আরও কি মার্জিত উপায় আছে? কোনটি বড় তার উপর নির্ভর করে অর্ডার পরিবর্তন হয়, অন্যথায় আপনি একটি সূচকআউটঅফবাউন্ড ব্যতিক্রম ছুঁড়ে দেন। এই টুকরোটি দেখুন ।
vsp

@vsp ডটইন্ডিসেটর সিলেকশন ইন্ডিকেটর ইন্টারফেস প্রয়োগ করে, যার অর্থ যদি দুটি কার্যকর পদ্ধতি থাকে যা আপনার সমস্যার সমাধান করতে পারে: int getNumberOfItems()এবং void setNumberOfItems()। ব্যতিক্রমটি ধরার পরিবর্তে আপনি এই gist.github.com/MatthewTamlin/761c7338d271af29526edc7859480aef এর মতো কিছু করতে পারেন ।
হেলিওস

যে কেউ সংক্ষিপ্ত কথোপকথন অনুসরণ করে না, তার জন্য আসলে একটি বাগ ছিল যা এখন ঠিক করা হয়েছে। 3.0.2 এখনই হিসাবে সর্বশেষতম সংস্করণ।
হেলিওস

18

ViewPagerIndicator ২০১২ সাল থেকে আপডেট করা হয়নি এবং বেশ কয়েকটি বাগ পাওয়া গেছে যা কখনও ঠিক করা হয়নি।

অবশেষে আমি এই হালকা লাইব্রেরির সাথে একটি বিকল্প পেয়েছি যা এর জন্য সুন্দর বিন্দু প্রদর্শন করে viewpager, এখানে লিঙ্কটি দেওয়া হল:

https://github.com/ongakuer/CircleIndicator

কার্যকর করা সহজ!


16

আমি উপরের সমস্যার জন্য একটি সহজ সমাধান পোস্ট করার কথা ভেবেছিলাম এবং সূচক সংখ্যাগুলি কেবলমাত্র একটি ভেরিয়েবলের মান পরিবর্তন করে dotCounts=xযা আমি এর মতো করে তা পরিবর্তন করে পরিবর্তন করা যেতে পারে ।

1) পৃষ্ঠার নির্বাচিত সূচকটির জন্য "আইটেম_সलेक्ट করা" নামক অঙ্কনযোগ্য ফোল্ডারে একটি এক্সএমএল ফাইল তৈরি করুন।

<?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 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আপনার লেআউট এক্সএমএল ফাইলের নীচে প্রাক্তন সূচকগুলি প্রদর্শন করতে চান এমন স্থানে কোডের এই অংশটি যুক্ত করুন ।

 <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) আপনার ক্রিয়াকলাপ ফাইল ফাইলের উপরে এই ফাংশনটি যুক্ত করুন যেখানে আপনার লেআউটটি স্ফীত হয় বা উপরের এক্সএমএল ফাইল সম্পর্কিত

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);
    }
}

৫) অবশেষে আপনার অনক্রিয়া পদ্ধতিতে আপনার লেআউটটি উল্লেখ করতে এবং পৃষ্ঠা নির্বাচন করা অবস্থানগুলি পরিচালনা করতে নিম্নলিখিত কোডটি যুক্ত করুন

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- ভিউপেজারআইডিকেটর


আমি কীভাবে বিন্দুগুলি যুক্ত করতে পারি, ট্যাবগুলি নয় (নেক্সাস 5 লঞ্চারের মতো)?
কেফির গাই

@ KfirGuy- কে তারা সূচক হিসাবে উল্লেখ করা হয়। আমি উপরে উল্লিখিত লাইব্রেরিটি ব্যবহার করে এটি করতে পারেন। এছাড়াও, আপনি এখানে এটি ক্রিয়াতে
জোয়েল ফার্নান্দেস

@ জোয়েল ফার্নান্দেস দেখে মনে হচ্ছে যে অ্যাপটি সমস্ত দেশে পাওয়া যায় না
34 মি0

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>

গ) মেইনএ্যাকটিভিটি.জভা

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) {

    }
}

ঘ) কাস্টমপেজারএডাপ্টার.জভা

 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সূচক হিসাবে থাম্বনেইলগুলির সাহায্যে একটি বিল্ড তৈরি করতে চান তবে এই লাইব্রেরিটি ব্যবহার করা একটি বিকল্প হতে পারে: ভিউপ্যাজারের জন্য থাম্ব ইন্ডিকেটেক্টর যা সংস্থার হিসাবে চিত্রের লিঙ্কগুলির সাথেও কাজ করে।


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>
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.