ongakuer / CircleIndicator

A lightweight indicator like in nexus 5 launcher
Apache License 2.0
4.27k stars 712 forks source link

Set width for only active dots #129

Open chiragsheta opened 5 years ago

chiragsheta commented 5 years ago
<me.relex.circleindicator.CircleIndicator
                    android:id="@+id/indicator"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    app:ci_width="@dimen/_10sdp"/>

It affect inactive dots, image

Inactive dots should be rounded like in 2nd image image

ongakuer commented 5 years ago

You can set different drawables

app:ci_drawable
app:ci_drawable_unselected
chiragsheta commented 5 years ago

I used that thing but width is not working

On Mon, 12 Aug 2019 at 08:03, relex notifications@github.com wrote:

You can set different drawables

app:ci_drawable app:ci_drawable_unselected

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/ongakuer/CircleIndicator/issues/129?email_source=notifications&email_token=ACPLEJ3MM6QMXGQD7FRSSTTQEDDYTA5CNFSM4IK24NJKYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOD4BOV5Y#issuecomment-520284919, or mute the thread https://github.com/notifications/unsubscribe-auth/ACPLEJ6QIYRPDBM7AN5U5WTQEDDYTANCNFSM4IK24NJA .

ongakuer commented 5 years ago

Here is a sample:

<me.relex.circleindicator.CircleIndicator
        android:id="@id/indicator"
        android:layout_width="match_parent"
        android:layout_height="48dp"
        android:layout_gravity="bottom"
        app:ci_animator="@animator/indicator_no_animator"
        app:ci_drawable="@drawable/active"
        app:ci_drawable_unselected="@drawable/normal"
        app:ci_height="12dp"
        app:ci_width="12dp"/>

active.xml

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:bottom="3dp"
        android:left="0dp"
        android:right="0dp"
        android:top="3dp">
        <shape>
            <corners android:radius="6dp"/>

            <solid android:color="@android:color/holo_red_dark"/>
        </shape>
    </item>
</layer-list>

normal.xml

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:bottom="3dp"
        android:left="3dp"
        android:right="3dp"
        android:top="3dp">
        <shape>
            <corners android:radius="6dp"/>
            <solid android:color="@android:color/holo_green_dark"/>
        </shape>
    </item>
</layer-list>
omkar-tenkale commented 2 years ago

You need to add app:ci_animator because default animator will scale the center dot, and as height is wrap content, it'll appear as a strip

image

      <me.relex.circleindicator.CircleIndicator2
                android:id="@+id/indicator"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                app:ci_width="6dp"
                app:ci_animator="@anim/indicator_no_scale"
                app:ci_margin="2.5dp"
                app:ci_drawable="@drawable/ic_circle_a4a4a4"
                app:ci_height="6dp"
                android:layout_marginTop="5dp" />

res/anim/indicator_no_scale.xml


<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="@android:integer/config_shortAnimTime">

    <objectAnimator
        android:propertyName="alpha"
        android:valueType="floatType"
        android:valueFrom="0.5"
        android:valueTo="1.0"/>
</set>