An easy-to-use customizable show case view with circular reveal animation.

@MaterialUp Best of the Day

Features

• Circular reveal animation (API Level 21+)
• Focus on a specific view or position
• Background color
• Circle and Rounded Rectangle focus shapes
• Title style and position
• Custom view inflation
• Custom enter/exit animations
• Chaining multiple FancyShowCaseView instances
• Showing only one time

Download

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 module build.gradle

dependencies {
    implementation 'com.github.faruktoptas:FancyShowCaseView:1.4.0'
}

Sample Usage

new FancyShowCaseView.Builder(this)
        .focusOn(view)
        .title("Focus on View")
        .build()
        .show();

Supported Properties

Command	Description
focusOn	The view to be focused.
title	The title text to be displayed.
typeface	The custom typeface for the title text.
titleStyle	The text style for the title. (style defined in xml file)
titleGravity	The gravity (alignment) of the title within the view (e.g., start, center, end).
titleSize	The size of the title text, typically in sp units.
enableAutoTextPosition	Center text position vertically.
backgroundColor	The background color of the view, typically in hexadecimal or resource ID format.
fitSystemWindows	This should be set to true, if your root view has this property set to true.
focusShape	The shape of the focus area (e.g., rounded rectangle, circle).
focusBorderColor	The color of the border around the focus area.
focusBorderSize	The thickness of the border around the focus area (px)
focusDashedBorder	Makes focus border dashed
roundRectRadius	The radius for rounded corners when the focus shape is a rectangle with rounded edges. Use 0 for rectangle shape.
showOnce	Determines if the focus should be shown only once.
clickableOn	Let the touch event pass through to clickable view zone only if clicking within
focusCircleRadiusFactor	Circle radius factor. Default value is 1. Bigger value makes bigger circle.
focusRectSizeFactor	Focus rectangle size factor. Default value is 1. Bigger value makes bigger rectangle.
customView	Use a fully customized view. If custom view used, title and title properties (titleStyle, titleGravity etc.) will be ignored.
closeOnTouch	Closes the FancyShowCaseView when touching it.
enableTouchOnFocusedView	Enables touching the focused view. Default value is false.
enterAnimation
exitAnimation
animationListener
disableFocusAnimation
focusAnimationMaxValue	Focus animation max value. Bigger value makes larger focus area.
focusAnimationStep	Step for focus animation. Default value is 1.
focusRectAtPosition
focusCircleAtPosition
dismissListener
delay	Shows the FancyShowCaseView after a delay.

Please see wiki for more samples.

Already in use in following apps

(feel free to send me new projects)

• News - Newspaper & Magazine
• NN Senin Mobilin
• Umíme česky
• DHIS2 Capture
• Travel Weather - Forecast plan for your trip
• muSync for Spotify

Sample App

Latest Release

Xamarin Port

Thanks to DigitalSa1nt for the Xamarin ported version Xamarin.ShowcaseView

Contribute

You can contribute by opening a pull request to dev branch. Please try to push one feature in one commit for a clean commit history.

Buy Me a Coffee

License

Apache License 2.0