ToggleIconView
ToggleIconView is a collection library of animated two-stage toggle icons for Android.
Installation
JitPack repository
// Project level build.gradle
allprojects {
repositories {
...
maven { url "https://jitpack.io" }
}
}
If the above doesn't work for you, try the following:
// settings.gradle
...
dependencyResolutionManagement {
...
repositories {
...
maven { url "https://jitpack.io" }
}
}
...
Implementation
// App level build.gradle
dependencies {
implementation "com.github.ozgurg:ToggleIconView:3.0.2"
}
Usage
<!-- See "Built-in icons" section for other icons -->
<og.android.lib.toggleiconview.rounded.PlayPause
android:layout_width="24dp"
android:layout_height="24dp" />
API
ToggleIconView, uses AnimatedVectorDrawableCompat under the hood and extends AppCompatImageView. So you can do anything you can with AppCompatImageView like tinting and other stuff. That's why I called it "collection library".
Attributes
| Attribute | Description | Type | Default |
|---|---|---|---|
app:checked |
Sets the initial state of the icon | Boolean |
false |
app:checkedContentDescription |
Sets the initial checked content description of the icon | String |
null |
app:uncheckedContentDescription |
Sets the initial unchecked content description of the icon | String |
null |
app:checkedTooltipText |
Sets the initial checked tooltip text of the icon | String |
null |
app:uncheckedTooltipText |
Sets the initial unchecked tooltip text of the icon | String |
null |
Methods
| Method | Description | Return |
|---|---|---|
toggle() |
Toggles between the checked and unchecked state of the icon | - |
.isChecked isChecked() |
Returns the checked state of the icon | Boolean |
.isChecked = Boolean setChecked(isChecked: Boolean) |
Sets the checked state of the icon | - |
.checkedContentDescription getCheckedContentDescription() |
Returns the checked content description of the icon | String? |
.checkedContentDescription = String? setCheckedContentDescription(value: String?) |
Sets the checked content description of the icon | - |
.uncheckedContentDescription getUncheckedContentDescription() |
Returns the unchecked content description of the icon | String? |
.uncheckedContentDescription = String? setUncheckedContentDescription(value: String?) |
Sets the unchecked content description of the icon | - |
.checkedTooltipText getCheckedTooltipText() |
Returns the checked tooltip text of the icon | String? |
.checkedTooltipText = String? setCheckedTooltipText(value: String?) |
Sets the checked tooltip text of the icon | - |
.uncheckedTooltipText getUncheckedTooltipText() |
Returns the unchecked tooltip text of the icon | String? |
.uncheckedTooltipText = String? setUncheckedTooltipText(value: String?) |
Sets the unchecked tooltip text of the icon | - |
Events
| Event | Description |
|---|---|
onCheckedChanged(view: ToggleIconView, isChecked: Boolean) |
Triggers when the checked state of the icon changed |
Built-in icons
All icons have the same duration (@android:integer/config_shortAnimTime) and interpolator (@android:interpolator/fast_out_slow_in), but I manually capture their previews; so timings may look different.
| Preview | Package |
|---|---|
 |
[Rounded] PlayPauseog.android.lib.toggleiconview.rounded.PlayPause |
 |
[Sharp] PlayPauseog.android.lib.toggleiconview.sharp.PlayPause |
 |
[Rounded] SoundOnOffog.android.lib.toggleiconview.rounded.SoundOnOff |
 |
[Sharp] SoundOnOffog.android.lib.toggleiconview.sharp.SoundOnOff |
 |
[Sharp] FlashOnOffog.android.lib.toggleiconview.sharp.FlashOnOff |
 |
[Sharp] AirplaneModeOnOffog.android.lib.toggleiconview.sharp.AirplaneModeOnOff |
How do you create your custom icon?
1) Create an icon
First, you need to create an AnimatedVectorDrawable icon. I highly recommend using Shape Shifter.
After creating and exporting your icon, add the icon to your project's drawable folder.
2) Implement the icon
Extend ToggleIconView class and set checked and unchecked icon you created.
package [PACKAGE_NAME]
import android.content.Context
import android.util.AttributeSet
import og.android.lib.toggleiconview.R
import og.android.lib.toggleiconview.ToggleIconView
class [NAME_YOUR_ICON] @JvmOverloads constructor(
context: Context,
attrs: AttributeSet? = null,
defStyleAttr: Int = 0
) :
ToggleIconView(
context, attrs, defStyleAttr,
R.drawable.[CHECKED_ICON],
R.drawable.[UNCHECKED_ICON]
)
Then, use it in your layout.
<[PACKAGE_NAME].[NAME_YOUR_ICON]
android:layout_width="24dp"
android:layout_height="24dp" />
![[] Android Library that implements Snackbars from Google's Material Design documentation.](https://github.com/nispok/snackbar/raw/master/art/home.png)
1.5k Dec 16, 2022
1.4k Jan 3, 2023
3 Jul 20, 2021
8.2k Jan 1, 2023
2 Apr 28, 2022
19.5k Dec 31, 2022
6.4k Dec 26, 2022
4.9k Dec 30, 2022
3k Jan 9, 2023
2.3k Dec 16, 2022
2.5k Jan 3, 2023
47.1k Jan 9, 2023
875 Dec 28, 2022
6k Dec 21, 2022
217 Nov 25, 2022
9.1k Jan 5, 2023
2.2k Dec 19, 2022
11.6k Dec 27, 2022
1.6k Nov 29, 2022