closeOnTouch set false make showcase skipped

[haaweejee]

Used FancyShowCaseView version 1.3.8

Screenshot if there is something wrong with ui

when i setting the showcase, the showcase should appear sequentially but, is jump to last show case the second show case not showed, but if closeOnTouch i set true is work fine but not compatible with ux, so do you have problem with this? and how to fix this? thanks you

How you show/hide FancyShowCaseView (in Activity or Fragment, in which method)

Example: this method I use the code below to show, for build function is show at the first time, and second time, and for buildLast function is for last show case:

class DetailCoachMark(private val activity: Activity, private val listener: BaseCoachMarkListener) {
    private lateinit var btFontSizeCoachmark: FancyShowCaseView
    private lateinit var btTetopiCoachmark: FancyShowCaseView
    private lateinit var btSettingCoachmark: FancyShowCaseView

    private var queue = FancyShowCaseQueue()

    /**
     * The first 3 coachmark added to queue
     * after all the 3 coachmark done, will show swipe coachmark
     */
    fun start(btFontSize: View, btTetopi: View, btSetting: View) {
        /**
         * build all the coachmark that will be show
         */
        btFontSizeCoachmark = buildFirst(
            btFontSize,
            activity.getString(R.string.font_size_coachmark_title),
            activity.getString(R.string.font_size_coachmark_subtitle),
            R.drawable.ic_font_adjustment_white
        )
        queue.add(btFontSizeCoachmark)

        btTetopiCoachmark = buildFirst(
            btTetopi,
            activity.getString(R.string.tetopi_coachmark_title),
            activity.getString(R.string.tetopi_coachmark_subtitle),
            R.drawable.ic_audio_coachmark
        )
        queue.add(btTetopiCoachmark)

        btSettingCoachmark = buildLast(btSetting)
        queue.add(btSettingCoachmark)
        queue.show()
        /**
         * add coachmark and show
         */
    }

    private fun addToQueue() {
        queue.add(btFontSizeCoachmark)
            .add(btTetopiCoachmark)
        queue.show()
    }

    private fun build(view: View, layout: (view: View) -> Unit) : FancyShowCaseView {
        return FancyShowCaseView.Builder(activity)
            .focusOn(view)
            .customView(R.layout.custom_coach_mark_detail, object : OnViewInflateListener {
                override fun onViewInflated(view: View) {
                    layout(view)
                }
            }).focusShape(FocusShape.CIRCLE)
            .backgroundColor(ContextCompat.getColor(activity, R.color.black_80_v1))
            .build()
    }

    private fun buildFirst(mView: View, title: String, subtitle: String, icon: Int): FancyShowCaseView {
        return build(mView){
            default(it, title, subtitle, icon)
        }
    }

    private fun default(view: View, title: String, subtitle: String, icon: Int) {
        val tvTitle = view.findViewById<View>(R.id.tv_title) as TextView
        val tvSubtitle = view.findViewById<View>(R.id.tv_subtitle) as TextView
        val ivIcon = view.findViewById<View>(R.id.iv_icon) as ImageView

        isNormal(view, true)

        tvTitle.text = title
        tvSubtitle.text = subtitle
        ivIcon.setImageResource(icon)

        view.findViewById<View>(R.id.bt_skip).setOnClickListener {
            listener.onSkip()
        }
    }

    private fun buildLast(view: View): FancyShowCaseView {
        return FancyShowCaseView.Builder(activity)
            .focusOn(view)
            .customView(
                R.layout.custom_coach_mark_detail,
                object : OnViewInflateListener {
                    override fun onViewInflated(view: View) {
                        isNormal(view, false)
                        view.findViewById<View>(R.id.bt_understand).setOnClickListener {
                            listener.onFinish()
                        }
                    }
                }
            ).closeOnTouch(false).focusShape(FocusShape.CIRCLE)
            .backgroundColor(ContextCompat.getColor(activity, R.color.black_80_v1))
            .build()
        }

    private fun isNormal(view: View, value: Boolean) {
        val llNormal = view.findViewById<View>(R.id.ll_normal) as LinearLayout
        val llCustom = view.findViewById<View>(R.id.ll_custom) as ConstraintLayout
        val btDone = view.findViewById<View>(R.id.bt_understand) as AppCompatButton
        val btSkip = view.findViewById<View>(R.id.bt_skip) as AppCompatButton

        if (value) {
            llNormal.show()
            llCustom.remove()
            btSkip.show()
        } else {
            llNormal.remove()
            llCustom.show()
            btDone.show()
        }
    }

    fun close() {
        queue.cancel(true)
    }

Your layout.xml file if the focus is wrong

[faruktoptas]

@haaweejee sorry for the late reply.

Can you try .hide() method instead of onSkip(). This will trigger the next show case item.

view.findViewById<View>(R.id.bt_skip).setOnClickListener {
            listener.hide()
        }

Wiki doc: https://github.com/faruktoptas/FancyShowCaseView/wiki/3.-Inflate-Custom-View