Spotlight

聚光灯

摇篮

dependencies {
    implementation ' com.github.takusemba:spotlight:x.x.x '
}

用法

 val spotlight = Spotlight . Builder ( this )
    .setTargets(firstTarget, secondTarget, thirdTarget .. .)
    .setBackgroundColor( R .color.spotlightBackground)
    .setDuration( 1000L )
    .setAnimation( DecelerateInterpolator ( 2f ))
    .setContainer(viewGroup)
    .setOnSpotlightListener( object : OnSpotlightListener {
      override fun onStarted () {
        Toast .makeText( this @MainActivity, " spotlight is started " , Toast . LENGTH_SHORT ).show()
      }
      override fun onEnded () {
        Toast .makeText( this @MainActivity, " spotlight is ended " , Toast . LENGTH_SHORT ).show()
      }
    })
    .build()         

如果您想立即显示 Spotlight，则必须等到视图布局完毕。

 // with core-ktx method.
view.doOnPreDraw { Spotlight . Builder ( this ) .. .start() }

目标

创建一个目标以添加 Spotlight。

目标是聚光灯投射的一个点。您可以将多个目标添加到 Spotlight。

 val target = Target . Builder ()
    .setAnchor( 100f , 100f )
    .setShape( Circle ( 100f ))
    .setEffect( RippleEffect ( 100f , 200f , argb( 30 , 124 , 255 , 90 )))
    .setOverlay(layout)
    .setOnTargetListener( object : OnTargetListener {
      override fun onStarted () {
        makeText( this @MainActivity, " first target is started " , LENGTH_SHORT ).show()
      }
      override fun onEnded () {
        makeText( this @MainActivity, " first target is ended " , LENGTH_SHORT ).show()
      }
    })
    .build()

开始/结束聚光灯

 val spotlight = Spotlight . Builder ( this ) .. .start()

spotlight.finish()

下一个/上一个/显示目标

 val spotlight = Spotlight . Builder ( this ) .. .start()

spotlight.next()

spotlight.previous()

spotlight.show( 2 )

定制形状

Shape定义了您的目标的外观。 Circle 和 RoundedRectangle 形状已经实现，但如果您想要自定义形状，可以通过实现Shape接口来实现。

 class CustomShape (
    override val duration : Long ,
    override val interpolator : TimeInterpolator
) : Shape {

  override fun draw ( canvas : Canvas , point : PointF , value : Float , paint : Paint ) {
    // draw your shape here.
  }
}

自定义效果

Effect允许您装饰您的目标。 RippleEffect 和 FlickerEffect 形状已经实现，但如果您想要自定义效果，可以通过实现Effect接口来实现。

 class CustomEffect (
    override val duration : Long ,
    override val interpolator : TimeInterpolator ,
    override val repeatMode : Int
) : Effect {

  override fun draw ( canvas : Canvas , point : PointF , value : Float , paint : Paint ) {
    // draw your effect here.
  }
}

样本

克隆此存储库并查看应用程序模块。

作者

• 船场卓
  • Github - (https://github.com/takusemba)
  • 推特- (https://twitter.com/takusemba)
  • Facebook - (https://www.facebook.com/takusemba)

执照

 Copyright 2017 Taku Semba.

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.