Skip to content

Spotlight

DV Infosys edited this page Oct 14, 2019 · 1 revision

Spotlight

Usage

Spotlight.with(this)
        .setOverlayColor(R.color.background)
        .setDuration(1000L)
        .setAnimation(new DecelerateInterpolator(2f))
        .setTargets(firstTarget, secondTarget, thirdTarget ...)
        .setClosedOnTouchedOutside(false)
        .setOnSpotlightStateListener(new OnSpotlightStateChangedListener() {
            @Override
            public void onStarted() {
                Toast.makeText(MainActivity.this, "spotlight is started", Toast.LENGTH_SHORT).show();
            }

            @Override
            public void onEnded() {
                Toast.makeText(MainActivity.this, "spotlight is ended", Toast.LENGTH_SHORT).show();
            }
        })
        .start();
                        

if you want to show Spotlight immediately, use addOnGlobalLayoutListener to wait until views are drawn.

view.getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
    @Override public void onGlobalLayout() {
        view.getViewTreeObserver().removeOnGlobalLayoutListener(this);
        Spotlight.with(this)...start();
    }
});


Simple Target

simply set a title and description, these position will be automatically calculated.

SimpleTarget simpleTarget = new SimpleTarget.Builder(this)
    .setPoint(100f, 340f)
    .setShape(new Circle(200f)) // or RoundedRectangle()
    .setTitle("the title")
    .setDescription("the description")
    .setOverlayPoint(100f, 100f)
    .setOnSpotlightStartedListener(new OnTargetStateChangedListener<SimpleTarget>() {
        @Override
        public void onStarted(SimpleTarget target) {
            // do something
        }
        @Override
        public void onEnded(SimpleTarget target) {
            // do something
        }
    })
    .build();


Custom Target

use your own custom view.

CustomTarget customTarget = new CustomTarget.Builder(this)
    .setPoint(100f, 340f)
    .setShape(new Circle(200f)) // or RoundedRectangle()
    .setOverlay(view)
    .setOnSpotlightStartedListener(new OnTargetStateChangedListener<CustomTarget>() {
        @Override
        public void onStarted(CustomTarget target) {
            // do something
        }
        @Override
        public void onEnded(CustomTarget target) {
            // do something
        }
    })
    .build();


Skip Target, Skip Spotlight

you can skip the current target or skip the all comming targets.

Spotlight spotlight = Spotlight.with(this)...start();

spotlight.closeCurrentTarget();

spotlight.closeSpotlight();

Custom Shape

custom shape is available implementing Shape interface

public class YourShape implements Shape {

    private float width;
    private float height;

    public YourShape(float width, float height) {
        this.width = width;
        this.height = height;
    }

    @Override
    public void draw(Canvas canvas, PointF point, float value, Paint paint) {
        // draw your shape using canvas.
    }
    ...
}

Clone this wiki locally