ToggleButtonLayout

Easy creation and management of toggle buttons from the Material Design spec. Read more about ToggleButtonLayout in our blog post.

What changed

I add two XML attrs to set the background and text color of the toggle.

To set background, use app:selectedColors. It accepts a TypedArray resource, for example:

<array name="toggle_colors">
    <item>#ff0000</item>
    <item>#00ff00</item>
    <item>#0000ff</item>
</array>

Similarly, use app:textColors to set the toggle's text color, it also accepts a TypedArray.

You can find usage in the sample app.

Dependency

Add this in your root build.gradle file (not your module build.gradle file):

allprojects {
    repositories {
        ...
        maven { url "https://jitpack.io" }
    }
}

Then, add the library to your project build.gradle

dependencies {
    implementation 'in.nerd-is:ToggleButtonLayout:latest.version.here'
}

Usage

Add the ToggleButtonLayout to your layout:

<com.savvyapps.togglebuttonlayout.ToggleButtonLayout
    android:id="@+id/toggle_button_layout"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center_horizontal"
    android:layout_marginBottom="16dp"
    app:menu="@menu/toggles" />

where the toggles menu looks like:

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

    <item
        android:id="@+id/toggle_left"
        android:icon="@drawable/ic_format_align_left_black_24dp" />

    <item
        android:id="@+id/toggle_center"
        android:icon="@drawable/ic_format_align_center_black_24dp" />

    <item
        android:id="@+id/toggle_right"
        android:icon="@drawable/ic_format_align_right_black_24dp" />
</menu>

You can safely ignore lint warnings about needing a title on each item, unless you want a title to appear on each item.

Later, you can get the selected items via:

val selectedToggles = toggleButtonLayout.getSelectedToggles()
//do what you need to with these selected toggles

Customization

You can customize the ToggleButtonLayout via XML attributes:

<com.savvyapps.togglebuttonlayout.ToggleButtonLayout
    android:id="@+id/toggle_text"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="center_horizontal"
    android:layout_margin="16dp"
    app:allowDeselection="false"
    app:customLayout="@layout/view_toggle_button"
    app:dividerColor="@android:color/darker_gray"
    app:selectedColor="?attr/colorAccent"
    app:menu="@menu/toggles"
    app:multipleSelection="true"
    app:toggleLayoutMode="even" />

If you use the customLayout attribute, the layout is expected to have a TextView with an ID of android:id="@android:id/text1" if you are using a title, and if you are using an icon, android:id="@android:id/icon". You can omit either of these if you are only using a menu resource with a title or just an icon. See the sample for more.

Notes

Please open an issue or make a pull request for additional features you might want. For PRs, please follow the Android Kotlin Style Guide

License

Copyright 2018 Savvy Apps

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

   http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.

Loong-T / ToggleButtonLayout