Widgets & Customization

HoloAccent provides a lot of customization out of the box but for some widgets, you will have to take some extra steps. In other cases, it provides additional options that are not available in the android framework.

AccentSwitch

The library provides its own implementation of the native Switch widget. The advantage is that it is properly styled. To use it just reference it in your layout xml file providing the full classpath:

<com.negusoft.holoaccent.widget.AccentSwitch
	android:id="@+id/switch"
	android:layout_width="wrap_content"
	android:layout_height="wrap_content" />

And you can instantiate it in code too, of course. Note that the widget will always have the Jelly Bean style (square thumb) instead of the Ice Cream Sandwich style (trapezoid/triangle thumb).

Colored Buttons

By applying the HoloAccent theme, your buttons will have the accent color applied when pressed or focused. Even if you explicitly specify any of the styles provided natively by android (buttonStyle, buttonStyleSmall, buttonStyleInset, buttonStyleToggle, borderlessButtonStyle) they will have the accent color set.

Apart from those, HoloAccent provides some additional colorful button styles:

• buttonStyleColored: Default button with dark accent color background background, bright when pressed.
• buttonStyleColoredBright: Default button with accent color background, dimmed when pressed.
• buttonStyleSmallColored: Colored version of buttonStyleSmall.
• buttonStyleSmallColoredBright: Dark colored version of buttonStyleSmall.

*each of the styles has an inverse equivalent where its text color is just the opposite (i.e. buttonStyleColoredInverse).

In the following example, there is a simple layout with three button. The first one with the default style, the second is colored and the third one has a bright colored style.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
	android:layout_width="match_parent"
	android:layout_height="wrap_content"
	android:orientation="vertical" >
	<Button
		android:id="@+id/defaultButton"
		android:layout_width="wrap_content"
		android:layout_height="wrap_content"
		android:text="Default" />
	<Button
		android:id="@+id/coloredButton"
		style="?attr/buttonStyleColored"
		android:layout_width="wrap_content"
		android:layout_height="wrap_content"
		android:text="Colored" />
	<Button
		android:id="@+id/coloredBrightButton"
		style="?attr/buttonStyleColoredBright"
		android:layout_width="wrap_content"
		android:layout_height="wrap_content"
		android:text="Colored Bright" />
</LinearLayout>

The same options are available for ImageButton widgets. In this case you will need to apply imageButtonStyleColored or imageButtonStyleColoredBright instead.

AccentSearchView

The SearchView is a common widget to provide search functionality in apps by showing an item in the action bar. It is usually hard to customize, so HoloAccent provides the AccentSearchView. Ususally, you will add this component in your menu xml resource. Just replace it by the HoloAccent implementation:

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android" >
    <item
        android:id="@+id/search"
        android:actionViewClass="com.negusoft.holoaccent.widget.AccentSearchView"
        android:icon="@android:drawable/ic_menu_search"
        android:showAsAction="always"
        android:title="@string/action_search">
    </item>
	...
</menu>

You can declare you variable as SearchView because AccentSearchView is a child of it. This means that you don't need to change your code:

Menu menu = ...;
SearchView searchView = (SearchView)menu.findItem(R.id.search).getActionView();

Other Widgets

HoloAccent provides implementation for the following widgets in order to apply the accent color correctly:

• DatePicker -> AccentDatePicker
• NumberPicker -> AccentNumberPicker
• TimePicker -> AccentTimePicker
• RatingBar -> AccentRatingBar
• QuickContactBadge -> AccentQuickContactBadge

They all extend the original class so you don't need to modify your code, just replace your layout xml file with the corresponding implementation. For example, replace the RatingBar widget by the AccentRatingBar:

...
<com.negusoft.holoaccent.widget.AccentRatingBar
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"/>
...

Notice that we specified the full class path, just like in the case of AccentSwitch.