[Java for Android App Development] nikwen:
Customization options

The ShowcaseView can be customized using the ShowcaseView.ConfigOptions object you pass to the ShowcaseView.insertShowcaseView() method.

For some strange reason, there are no getter/setter methods for that class. So you can access the fields of that class directly.

This is the basic code for the following code snippets:

ShowcaseView.ConfigOptions co = new ShowcaseView.ConfigOptions();
co.hideOnClickOutside = true;
ShowcaseView sv = ShowcaseView.insertShowcaseView(R.id.showcasedView, this, R.string.showcase_title, R.string.showcase_message, co);

Don't respond to touches outside the showcased area

co.hideOnClickOutside = false;
co.block = true;

The field "block" determines whether the app will respond to touches outside the showcased area.

Don't hide the ShowcaseView on touches outside the showcased area

co.hideOnClickOutside = false;

The field "hideOnClickOutside" determines whether the view will be hidden when the screen is touched outside the highlighted area.

Set a fade-in or fade-out duration

The proper fields:

co.fadeInDuration = 1000;
co.fadeOutDuration = 1000;

Using these fields, you can set the time it will take the ShowcaseView to fade in or out.

Don't overlay the ActionBar

co.insert = ShowcaseView.INSERT_TO_VIEW;

This field allows you to determine whether the ShowcaseView will overlay the ActionBar.

Possible values:

Hide the button

co.noButton = true;

This field allows you to hide the button of the ShowcaseView.

Show the overlay only once

co.shotType = ShowcaseView.TYPE_ONE_SHOT;

This field determines how often the overlay should be shown.

Possible values:

Change the circle radius

Use the method setShowcaseIndicatorScale(float scaleMultiplier) of ShowcaseView for that:

sv.setShowcaseIndicatorScale(1.5f);

Theming

The ShowcaseView library offers plenty of options to adjust the appearance of the ShowcaseView.

Fortunately, the library allows you to theme the ShowcaseView as a whole.

To theme the appearance of the ShowcaseView you need to create a style derived from either the ShowcaseView or ShowcaseView.Light style:

<style name="CustomShowcaseTheme" parent="ShowcaseView.Light">
<item name="sv_backgroundColor">#33ffbb33</item>
<item name="sv_buttonBackgroundColor">#CF3119</item>
<item name="sv_buttonText">Close</item>
<item name="sv_titleTextAppearance">@style/CustomTitle</item>
<item name="sv_detailTextAppearance">@style/CustomDetailText</item>
</style>

(Add this to your /res/values/styles.xml file.)

The different options allow you to change the colors of the View and the text of the button.

The text styling is done using TextAppearance styles like this:

<style name="CustomTitle" parent="TextAppearance.ShowcaseView.Title">
<item name="android:textColor">#00801A</item>
</style>

<style name="CustomDetailText" parent="TextAppearance.ShowcaseView.Detail">
<item name="android:textColor">#00801A</item>
</style>

(Add this to your /res/values/styles.xml file.)

For a lighter theme, use "TextAppearance.ShowcaseView.Title.Light" and "TextAppearance.ShowcaseView.Detail.Light" as parent themes instead.

Then add this to the /res/values/styles.xml file as well:

<style name="CustomAppTheme" parent="android:Theme.Light">
<item name="showcaseViewStyle">@style/CustomShowcaseTheme</item>
</style>

(You might want to replace Theme.Light by another one.)

Furthermore, add this to the /res/values-v14/styles.xml file:

<style name="CustomAppTheme" parent="android:Theme.Holo.Light">
<item name="showcaseViewStyle">@style/CustomShowcaseTheme</item>
</style>

(You might want to replace Theme.Holo.Light by another one.)

The last step is adding this to the <application> tag in your AndroidManifest.xml:

<application
android:theme="@style/CustomAppTheme"
... />

You're done. You successfully themed your ShowcaseView. :)

Attributions

Big thanks to Alex Curran for the library.

I wouldn't have got the idea to write this guide without [MENTION=4153009]marty331[/MENTION]'s guide. Thank you, Marty.

Moreover, I got inspired by the sample folder of the ShowcaseView project.

This was featured on the XDA portal on August 31, 2013. :D