手把手教写教程引导UI

于 2021-03-30 19:06:56 发布
阅读量161 收藏
点赞数
分类专栏： android
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_43988374/article/details/115321820
版权
本文详细介绍了如何构建一个教程引导UI，包括在布局上添加蒙版控件、计算目标控件高亮、调整指引位置等步骤，并提供了相关的工具类和接口。此外，还涉及到了如何通过教程构建器来定制属性，以及如何在实际项目中根据需求实现动画效果。
摘要由CSDN通过智能技术生成

手把手教写教程引导UI

教程引导UI是指用户第一次进入APP会教用户如何使用的一个功能
现在市场上比较出名的APP，基本都会有这个UI，特别游戏大多数都会有
很多人一遇到这种需求就头大，现在我一步一步教您学会该控件的分析与写法

分析教程引导UI思路

  • 在布局上面加一个控件
  • 计算针对对象所在位置控件高亮
  • 在针对对象控件加入指引控件
  • 调整指引控件所在位置,到这步就已经完成，至于其他属性可以根据项目需求自己去调整实现

如何在布局上面加一个控件

  1. 建立蒙层根控件
package com.icez.myapplication.weight.tutorials

import android.content.Context
import android.graphics.*
import android.util.AttributeSet
import android.view.ViewGroup

/**
 * 蒙层根布局
 */
class TutorialsView :ViewGroup{
    /**
     * 蒙层范围
     */
    var mOverlayRect: Rect ?= null

    /**
     * 蒙层画布
     */
    var mOverlayCanvas:Canvas ?= null

    /**
     * 蒙层位图
     */
    var mOverlayBitmap:Bitmap ?= null

    var mOverlayPaint:Paint ?= null
    constructor(context:Context):this(context,null)
    constructor(context:Context,attrs: AttributeSet?):this(context,attrs,0)
    constructor(context: Context, attrs: AttributeSet?, defStyle: Int):super(context,attrs,defStyle){
        init()
    }
    override fun onLayout(changed: Boolean, l: Int, t: Int, r: Int, b: Int) {

    }

    override fun onMeasure(widthMeasureSpec: Int, heightMeasureSpec: Int) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec)
    }

    override fun onDraw(canvas: Canvas?) {
        super.onDraw(canvas)
        //设置填充的位图颜色,0表示透明
        mOverlayBitmap?.eraseColor(0)
        //设置画布的颜色
        mOverlayPaint?.color?.let { mOverlayCanvas?.drawColor(it) }
        mOverlayRect?.left?.toFloat()?.let {
            mOverlayRect?.top?.toFloat()?.let { it1 ->
                mOverlayBitmap?.let { it2 ->
                    canvas?.drawBitmap(
                        it2,
                        it, it1,null)
                }
            }
        }
    }

    fun setTutorialsColor(color:Int){
        mOverlayPaint?.color = color
    }

    fun setTutorialsAlpha(alpha:Int){
        mOverlayPaint?.alpha = alpha
    }

    fun init(){
        //防止绘制出现问题
        setWillNotDraw(false)
        mOverlayRect = Rect()
        val wh = TutorialsUtil.getWindowSize(context)
        mOverlayRect?.set(0,0,wh[0],wh[1])
        mOverlayBitmap = Bitmap.createBitmap(wh[0],wh[1],Bitmap.Config.ARGB_8888)
        mOverlayCanvas = Canvas()
        mOverlayCanvas?.setBitmap(mOverlayBitmap)
        mOverlayPaint = Paint()
    }

}
  1. 建立教程属性类
package com.icez.myapplication.weight.tutorials

import android.view.View

/**
 * 教程属性
 */
data class TutorialsAttrs(
    var mTargetView: View? = null,//针对控件
    var mAlpha:Int = 150
)
  1. 建立教程子控件接口
package com.icez.myapplication.weight.tutorials

import android.view.View

/**
 * 子控件
 */
interface TutorialsAdapter{
    fun getView(): View
}
  1. 建立教程构建器
package com.icez.myapplication.weight.tutorials

import android.view.View
import android.view.ViewGroup
import java.lang.RuntimeException

/**
 * 教程构建器，用于自定义蒙层控件的属性
 */
class TutorialsBuilder{
    var mTutorialsAttrs:TutorialsAttrs ?= null
    var mTutorialsAdapter:TutorialsAdapter ?= null
    init {
        mTutorialsAttrs = TutorialsAttrs()
    }

    /**
     * 设置教程控件
     */
    fun setTargetView(targetView: View):TutorialsBuilder{
        if(targetView==null){
            throw RuntimeException("Icez hint:targetView is not null. Please check it.")
        }
        mTutorialsAttrs?.mTargetView = targetView
        return this
    }

    /**
     * 设置蒙层透明度
     */
    fun setAlpha(alpha:Int):TutorialsBuilder{
        if(alpha<0){
            throw RuntimeException("Icez hint:alpha cannot be less than zero. Please check it.")
        }
        mTutorialsAttrs?.mAlpha = alpha
        return this
    }

    /**
     * 设置蒙层子控件
     */
    fun setTutorialsAdapter(tutorialsAdapter: TutorialsAdapter):TutorialsBuilder{
        if(tutorialsAdapter==null){
            throw RuntimeException("Icez hint:tutorialsAdapter is not null. Please check it.")
        }
        mTutorialsAdapter = tutorialsAdapter
        return this
    }

    /**
     * 创建蒙层教程属性
     */
    fun createTutorials():Tutorials{
        val mTutorials = Tutorials()
        mTutorials.mTutorialsAttrs = mTutorialsAttrs
        mTutorials.mTutorialsAdapter = mTutorialsAdapter
        return mTutorials
    }
}
  1. 创建教程管理类
package com.icez.myapplication.weight.tutorials

import android.app.Activity
import android.view.KeyEvent
import android.view.MotionEvent
import android.view.View
import android.view.ViewGroup

/**
 * 教程管理类
 */
class Tutorials : View.OnTouchListener {
    var mTutorialsAdapter:TutorialsAdapter ?= null
    var mTutorialsView: TutorialsView? = null
    var mActivity:Activity ?= null
    var mRootView:ViewGroup ?= null
    var mTutorialsAttrs:TutorialsAttrs ?= null


    /**
     * 显示教程UI
     */
    fun show(activity:Activity,rootView: ViewGroup?) {
        mRootView = rootView
        mActivity = activity
        if (mRootView == null) {
            mRootView = mActivity?.window?.decorView as ViewGroup
        }
        mTutorialsView = createTutorials(mActivity)
        if (mRootView != null && mTutorialsView != null) {
            mRootView?.addView(mTutorialsView)
        }
    }

    /**
     * 创建教程控件
     */
    fun createTutorials(activity: Activity?): TutorialsView? {
        val mTutorialsView: TutorialsView? = activity?.let { TutorialsView(it) }
        mTutorialsView?.setTutorialsAlpha(mTutorialsAttrs?.mAlpha?:0)
        mTutorialsView?.setOnTouchListener(this)
        return mTutorialsView
    }

    /**
     * 关闭教程UI
     */
    fun dimiss(){
        mTutorialsView?.removeAllViews()
        mRootView?.removeView(mTutorialsView)
        mTutorialsView = null
    }

    override fun onTouch(v: View?, event: MotionEvent?): Boolean {
        return true
    }


}
  1. 工具类
package com.icez.myapplication.weight.tutorials

import android.content.Context
import android.util.DisplayMetrics
import android.view.WindowManager

/**
 * 工具类
 */
class TutorialsUtil {
    companion object{
        /**
         * 获取窗口的大小
         */
        fun getWindowSize(context: Context): IntArray {
            val wh = IntArray(2)
            val wm:WindowManager = context.getSystemService(Context.WINDOW_SERVICE) as WindowManager
            val displayMetrics:DisplayMetrics = DisplayMetrics()
            wm.defaultDisplay.getRealMetrics(displayMetrics)
            wh[0] = displayMetrics.widthPixels
            wh[1] = displayMetrics.heightPixels
            return wh
        }
    }
}

计算针对对象所在位置控件高亮

  1. 修改TutorialsBuilder类
package com.icez.myapplication.weight.tutorials

import android.view.View
import android.view.ViewGroup
import java.lang.RuntimeException

/**
 * 教程构建器，用于自定义蒙层控件的属性
 */
class TutorialsBuilder{
    var mTutorialsAttrs:TutorialsAttrs ?= null
    var mTutorialsAdapter:TutorialsAdapter ?= null
    init {
        mTutorialsAttrs = TutorialsAttrs()
    }

    /**
     * 设置教程控件
     */
    fun setTargetView(targetView: View):TutorialsBuilder{
        if(targetView==null){
            throw RuntimeException("Icez hint:targetView is not null. Please check it.")
        }
        mTutorialsAttrs?.mTargetView = targetView
        return this
    }

    /**
     * 设置蒙层透明度
     */
    fun setAlpha(alpha:Int):TutorialsBuilder{
        if(alpha<0){
            throw RuntimeException("Icez hint:alpha cannot be less than zero. Please check it.")
        }
        mTutorialsAttrs?.mAlpha = alpha
        return this
    }

    /**
     * 设置蒙层子控件
     */
    fun setTutorialsAdapter(tutorialsAdapter: TutorialsAdapter):TutorialsBuilder{
        if(tutorialsAdapter==null){
            throw RuntimeException("Icez hint:tutorialsAdapter is not null. Please check it.")
        }
        mTutorialsAdapter = tutorialsAdapter
        return this
    }

    /**
     * 创建蒙层教程属性
     */
    fun createTutorials():Tutorials{
        val mTutorials = Tutorials()
        mTutorials.mTutorialsAttrs = mTutorialsAttrs
        mTutorials.mTutorialsAdapter = mTutorialsAdapter
        return mTutorials
    }
}
  1. 修改TutorialsView 类
package com.icez.myapplication.weight.tutorials

import android.content.Context
import android.graphics.*
import android.util.AttributeSet
import android.view.ViewGroup

/**
 * 蒙层根布局
 */
class TutorialsView :ViewGroup{

    var mTargetRectF:RectF ?= null

    /**
     * 蒙层范围
     */
    var mOverlayRect: Rect ?= null

    /**
     * 蒙层画布
     */
    var mOverlayCanvas:Canvas ?= null

    /**
     * 蒙层位图
     */
    var mOverlayBitmap:Bitmap ?= null

    var mOverlayPaint:Paint ?= null

    var mTargetPaint:Paint ?= null

    constructor(context:Context):this(context,null)
    constructor(context:Context,attrs: AttributeSet?):this(context,attrs,0)
    constructor(context: Context, attrs: AttributeSet?, defStyle: Int):super(context,attrs,defStyle){
        init()
    }
    override fun onLayout(changed: Boolean, l: Int, t: Int, r: Int, b: Int) {

    }

    override fun onMeasure(widthMeasureSpec: Int, heightMeasureSpec: Int) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec)
    }

    override fun onDraw(canvas: Canvas?) {
        super.onDraw(canvas)
        //设置填充的位图颜色,0表示透明
        mOverlayBitmap?.eraseColor(0)
        //设置画布的颜色
        mOverlayPaint?.color?.let { mOverlayCanvas?.drawColor(it) }

        mTargetPaint?.let { mTargetRectF?.let { it1 -> mOverlayCanvas?.drawRoundRect(it1,20f,20f, it) } }

        mOverlayRect?.left?.toFloat()?.let {
            mOverlayRect?.top?.toFloat()?.let { it1 ->
                mOverlayBitmap?.let { it2 ->
                    canvas?.drawBitmap(
                        it2,
                        it, it1,null)
                }
            }
        }
    }

    fun setTutorialsColor(color:Int){
        mOverlayPaint?.color = color
    }

    fun setTutorialsAlpha(alpha:Int){
        mOverlayPaint?.alpha = alpha
    }

    /**
     * 设置针对控件范围以及位置
     */
    fun setTargetRect(targetRect:Rect){
        mTargetRectF?.set(targetRect)
    }

    fun init(){
        //防止绘制出现问题
        setWillNotDraw(false)
        mOverlayRect = Rect()
        val wh = TutorialsUtil.getWindowSize(context)
        mOverlayRect?.set(0,0,wh[0],wh[1])
        mOverlayBitmap = Bitmap.createBitmap(wh[0],wh[1],Bitmap.Config.ARGB_8888)
        mOverlayCanvas = Canvas()
        mOverlayCanvas?.setBitmap(mOverlayBitmap)
        mOverlayPaint = Paint()
        mTargetPaint = Paint(Paint.ANTI_ALIAS_FLAG)
        mTargetPaint?.setColor(Color.WHITE)
        mTargetPaint?.setXfermode(PorterDuffXfermode(PorterDuff.Mode.CLEAR))
        mTargetRectF = RectF()
    }

}
  1. 修改TutorialsUtil类
package com.icez.myapplication.weight.tutorials

import android.content.Context
import android.graphics.Rect
import android.util.DisplayMetrics
import android.view.View
import android.view.WindowManager

/**
 * 工具类
 */
class TutorialsUtil {
    companion object{
        /**
         * 获取窗口的大小
         */
        fun getWindowSize(context: Context): IntArray {
            val wh = IntArray(2)
            val wm:WindowManager = context.getSystemService(Context.WINDOW_SERVICE) as WindowManager
            val displayMetrics:DisplayMetrics = DisplayMetrics()
            wm.defaultDisplay.getRealMetrics(displayMetrics)
            wh[0] = displayMetrics.widthPixels
            wh[1] = displayMetrics.heightPixels
            return wh
        }

        /**
         * 计算控件的范围大小
         */
        fun getViewSize(targetView: View):Rect{
            val lt = IntArray(2)
            targetView.getLocationInWindow(lt)
            val targetRect = Rect()
            targetRect.set(lt[0],lt[1],lt[0]+targetView.measuredWidth,lt[1]+targetView.measuredHeight)
            return targetRect
        }
    }
}

调整指引控件所在位置

  1. 修改TutorialsView 类
package com.icez.myapplication.weight.tutorials

import android.content.Context
import android.graphics.*
import android.util.AttributeSet
import android.util.Log
import android.view.View
import android.view.ViewGroup

/**
 * 蒙层根布局
 */
class TutorialsView :ViewGroup{

    var mTargetRectF:RectF ?= null

    /**
     * 蒙层范围
     */
    var mOverlayRect: Rect ?= null

    /**
     * 蒙层画布
     */
    var mOverlayCanvas:Canvas ?= null

    /**
     * 蒙层位图
     */
    var mOverlayBitmap:Bitmap ?= null

    var mOverlayPaint:Paint ?= null

    var mTargetPaint:Paint ?= null

    var mTargetViewLeft:Int = 0

    var mTargetViewTop:Int = 0

    var mOverylayLocation:Int = TutorialsAdapter.OVERLAY

    constructor(context:Context):this(context,null)
    constructor(context:Context,attrs: AttributeSet?):this(context,attrs,0)
    constructor(context: Context, attrs: AttributeSet?, defStyle: Int):super(context,attrs,defStyle){
        init()
    }

    override fun onDetachedFromWindow() {
        super.onDetachedFromWindow()
        mTargetRectF = null
        mOverlayRect = null
        mOverlayCanvas = null
        mOverlayBitmap = null
        mOverlayPaint = null
        mTargetPaint = null

    }
    override fun onLayout(changed: Boolean, l: Int, t: Int, r: Int, b: Int) {

        val childCount = childCount
        if(childCount>0){
            val child = getChildAt(0)
            when(mOverylayLocation){
                TutorialsAdapter.TOP -> {
                    child.layout(0,0,measuredWidth,mTargetViewTop)
                }
                TutorialsAdapter.LEFT -> {
                    child.layout(0,0,mTargetViewLeft,measuredHeight)
                }
                TutorialsAdapter.BOTTOM -> {
                    val wh = TutorialsUtil.getWindowSize(context)//下面
                    val mTargetRectFHeight = mTargetRectF?.height()?:0
                    child.layout(0,mTargetViewTop + mTargetRectFHeight.toInt(),measuredWidth,mTargetViewTop + mTargetRectFHeight.toInt()+(wh[1]-(mTargetViewTop + mTargetRectFHeight.toInt())))
                }
                TutorialsAdapter.RIGHT -> {
                    val wh = TutorialsUtil.getWindowSize(context)//右边
                    child.layout(mTargetViewLeft+(mTargetRectF?.width()?:0).toInt(),0,mTargetViewLeft+(mTargetRectF?.width()?:0).toInt()+(wh[0]-(mTargetRectF?.width()?:0).toInt()-mTargetViewLeft),measuredHeight)
                }
                TutorialsAdapter.OVERLAY -> {
                    child.layout(0,0,measuredWidth,measuredHeight)
                }
            }
        }

    }


    override fun onMeasure(widthMeasureSpec: Int, heightMeasureSpec: Int) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec)
        Log.e("icez","onMeasure")
        //获取绘制的宽度
        val w:Int = MeasureSpec.getSize(widthMeasureSpec)
        //获取绘制的高度
        val h:Int = MeasureSpec.getSize(heightMeasureSpec)
        setMeasuredDimension(w,h)
        val count:Int = childCount
        var child: View?= null
        //繪製子控件的大小
        for(index in 0 until count){
            child = getChildAt(index)
            if(child != null){
                //繪製子控件的大小
                measureChild(child, widthMeasureSpec, heightMeasureSpec)
            }
        }
    }


    override fun onDraw(canvas: Canvas?) {
        super.onDraw(canvas)
        //设置填充的位图颜色,0表示透明
        mOverlayBitmap?.eraseColor(0)
        //设置画布的颜色
        mOverlayPaint?.color?.let { mOverlayCanvas?.drawColor(it) }

        mTargetPaint?.let { mTargetRectF?.let { it1 -> mOverlayCanvas?.drawRoundRect(it1,20f,20f, it) } }

        mOverlayRect?.left?.toFloat()?.let {
            mOverlayRect?.top?.toFloat()?.let { it1 ->
                mOverlayBitmap?.let { it2 ->
                    canvas?.drawBitmap(
                        it2,
                        it, it1,null)
                }
            }
        }
    }

    fun setTutorialsColor(color:Int){
        mOverlayPaint?.color = color
    }

    fun setOverylayLocation(overylayLocation:Int){
        mOverylayLocation = overylayLocation
    }

    fun setTutorialsAlpha(alpha:Int){
        mOverlayPaint?.alpha = alpha
    }

    /**
     * 设置针对控件范围以及位置
     */
    fun setTargetRect(targetRect:Rect,targetViewLeft:Int,targetViewTop:Int){
        mTargetViewLeft = targetViewLeft
        mTargetViewTop = targetViewTop
        mTargetRectF?.set(targetRect)
    }

    fun init(){
        //防止绘制出现问题
        setWillNotDraw(false)
        mOverlayRect = Rect()
        val wh = TutorialsUtil.getWindowSize(context)
        mOverlayRect?.set(0,0,wh[0],wh[1])
        mOverlayBitmap = Bitmap.createBitmap(wh[0],wh[1],Bitmap.Config.ARGB_8888)
        mOverlayCanvas = Canvas()
        mOverlayCanvas?.setBitmap(mOverlayBitmap)
        mOverlayPaint = Paint()
        mTargetPaint = Paint(Paint.ANTI_ALIAS_FLAG)
        mTargetPaint?.setColor(Color.WHITE)
        mTargetPaint?.setXfermode(PorterDuffXfermode(PorterDuff.Mode.CLEAR))
        mTargetRectF = RectF()
    }

}
  1. 修改Tutorials 类
package com.icez.myapplication.weight.tutorials

import android.app.Activity
import android.view.KeyEvent
import android.view.MotionEvent
import android.view.View
import android.view.ViewGroup

/**
 * 教程管理类
 */
class Tutorials : View.OnTouchListener {
    var mTutorialsAdapter:TutorialsAdapter ?= null
    var mTutorialsView: TutorialsView? = null
    var mActivity:Activity ?= null
    var mRootView:ViewGroup ?= null
    var mTutorialsAttrs:TutorialsAttrs ?= null


    /**
     * 显示教程UI
     */
    fun show(activity:Activity,rootView: ViewGroup?) {
        mRootView = rootView
        mActivity = activity
        if (mRootView == null) {
            mRootView = mActivity?.window?.decorView as ViewGroup
        }
        mTutorialsView = createTutorials(mActivity)
        if (mRootView != null && mTutorialsView != null) {
            mRootView?.addView(mTutorialsView)
        }
    }

    /**
     * 创建教程控件
     */
    fun createTutorials(activity: Activity?): TutorialsView? {
        val mTutorialsView: TutorialsView? = activity?.let { TutorialsView(it) }
        mTutorialsView?.setTutorialsAlpha(mTutorialsAttrs?.mAlpha?:0)
        mTutorialsView?.setOnTouchListener(this)
        mTutorialsAttrs?.mTargetView?.let {
            TutorialsUtil.getViewSize(
                it
            )
        }?.let { mTutorialsView?.setTargetRect(it,TutorialsUtil.getViewLeftTop(mTutorialsAttrs?.mTargetView!!)[0],TutorialsUtil.getViewLeftTop(mTutorialsAttrs?.mTargetView!!)[1]) }
        mTutorialsAdapter?.getPosition()?.let { mTutorialsView?.setOverylayLocation(it) }
        mTutorialsView?.removeAllViews()
        mTutorialsView?.addView(mTutorialsAdapter?.getView(this))
        return mTutorialsView
    }



    /**
     * 关闭教程UI
     */
    fun dimiss(){
        mTutorialsView?.removeAllViews()
        mRootView?.removeView(mTutorialsView)
        mTutorialsView = null
    }

    override fun onTouch(v: View?, event: MotionEvent?): Boolean {
        return true
    }


}
  1. 修改TutorialsAdapter类
package com.icez.myapplication.weight.tutorials

import android.view.View

/**
 * 子控件
 */
open interface TutorialsAdapter{

    companion object{
        val TOP = 0x01
        val BOTTOM = 0x02
        val LEFT = 0x03
        val RIGHT = 0x04
        val OVERLAY = 0x05
    }
    fun getView(mTutorials: Tutorials): View

    fun getPosition():Int
}
  1. 修改TutorialsAttrs类
package com.icez.myapplication.weight.tutorials

import android.view.View

/**
 * 教程属性
 */
data class TutorialsAttrs(
    var mTargetView: View? = null,//针对控件
    var mAlpha:Int = 150,
    var mLocation:Int = TutorialsAdapter.OVERLAY
)
  1. 修改TutorialsBuilder类
package com.icez.myapplication.weight.tutorials

import android.view.View
import android.view.ViewGroup
import java.lang.RuntimeException

/**
 * 教程构建器，用于自定义蒙层控件的属性
 */
class TutorialsBuilder{
    var mTutorialsAttrs:TutorialsAttrs ?= null
    var mTutorialsAdapter:TutorialsAdapter ?= null
    init {
        mTutorialsAttrs = TutorialsAttrs()
    }

    /**
     * 设置教程控件
     */
    fun setTargetView(targetView: View):TutorialsBuilder{
        if(targetView==null){
            throw RuntimeException("Icez hint:targetView is not null. Please check it.")
        }
        mTutorialsAttrs?.mTargetView = targetView
        return this
    }

    /**
     * 设置蒙层透明度
     */
    fun setAlpha(alpha:Int):TutorialsBuilder{
        if(alpha<0){
            throw RuntimeException("Icez hint:alpha cannot be less than zero. Please check it.")
        }
        mTutorialsAttrs?.mAlpha = alpha
        return this
    }

    /**
     * 设置蒙层子控件
     */
    fun setTutorialsAdapter(tutorialsAdapter: TutorialsAdapter):TutorialsBuilder{
        if(tutorialsAdapter==null){
            throw RuntimeException("Icez hint:tutorialsAdapter is not null. Please check it.")
        }
        mTutorialsAdapter = tutorialsAdapter
        return this
    }

    /**
     * 创建蒙层教程属性
     */
    fun createTutorials():Tutorials{
        val mTutorials = Tutorials()
        mTutorials.mTutorialsAttrs = mTutorialsAttrs
        mTutorials.mTutorialsAdapter = mTutorialsAdapter
        return mTutorials
    }
}

完成

到这步骤基本完成了，剩余的动画，需要自己根据项目需求去实现
希望对读者有点帮助

冰（Icez）
关注
专栏目录
Android UI设计与开发之实现应用程序只启动一次引导界面
08-29
主要为大家详细介绍了Android UI设计与开发之实现应用程序只启动一次引导界面，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
探索React Shepherd：引导式UI的优雅解决方案
gitblog_00069的博客
04-26 455
探索React Shepherd：引导式UI的优雅解决方案 项目地址:https://gitcode.com/shipshapecode/react-shepherd React Shepherd 是一个基于React的库，它为你的应用提供了一种简单而有效的方法来创建用户引导和教程。如果你正在寻找一种方式来帮助用户更好地理解和利用你的产品功能，那么React Shepherd可能就是你要找的答案。...
最容易上手的vue2.0实战入门教程（第5-6章）
06-19
总之，"最容易上手的vue2.0实战入门教程（第5-6章）"将引导您进入Vue的世界，通过这两章的学习，您不仅能够掌握Vue的基本用法，还能理解其核心设计思想。结合实际项目练习，相信您将迅速成长为一名熟练的Vue开发者。...
手把手教你做UG二次开发.doc
01-09
标题与描述均提到了“手把手教你做UG二次开发”，这明确指向了对UG（Unigraphics，一种高级的三维CAD/CAM/CAE软件）进行定制化开发的教学指南。以下将深入解析文档中提到的关键步骤及涉及的知识点： ### 一手搭建...
手把手教你开发微博
05-31
这篇教程——《手把手教你用Android开发新浪微博客户端》将带你深入理解如何构建一个功能齐全的微博应用。从这个标题我们可以推测，本教程主要针对Android平台，旨在帮助开发者了解并实践微博客户端的开发。 【描述...
Quest3D 手把手教学系列1-5讲
07-15
本教程"Quest3D 手把手教学系列1-5讲"是初学者入门的绝佳资源，涵盖了从基础到进阶的各种主题。教程分为两部分，1-5讲和6-10讲，旨在逐步引导学习者掌握Quest3D的基本操作和核心概念。 在第一讲"最简单的开始"中，...
Silverlight 4 手把手
05-14
《Silverlight 4 手把手》是一份详尽的教程，旨在引导学习者掌握Silverlight 4这一强大的富客户端开发技术。Silverlight是微软推出的一种Web应用程序开发平台，它允许开发者创建具有丰富交互性和多媒体元素的网页...
基于JavaWeb的门店管理系统源代码+数据库
09-25
基于JavaWeb的门店管理系统源代码+数据库
基于国产自研的简洁易扩展warm-flow工作流设计源码
09-25
本项目为国产自研的warm-flow工作流设计源码，采用简洁的架构设计，仅需6张基础表，却能实现全面的功能。代码结构清晰，组件独立且易于扩展，非常适合中小型项目使用。源码包含215个文件，涵盖158个Java源文件、32个XML配置文件、7个SQL文件等，旨在为用户提供高效、灵活的工作流解决方案。
Java JNI例子-创建DLL、项目导入DLL、IDEA配置JNI、JNI调用DLL（该DLL同时依赖第三方DLL）
09-25
Java JNI例子-创建DLL、项目导入DLL、IDEA配置JNI、JNI调用DLL（该DLL同时依赖第三方DLL）
25中车株洲最常见面试题目总结 机械面试经验分享
09-25
部分面试题目展示： 1、姓名？年龄？籍贯？ 2、本、硕学校、专业？本、硕专业成绩排名？有无挂科？ 3、四、六级是否通过？ 4、家庭情况：父母职业？是否独生？是否单身？女（男）朋友在哪来读书或者工作？ 5、意向岗位方向？意向工作城市？ 6、目前是否已拿到offer？公司和岗位？ 源文件内容概要： 本资源文件是一份详尽的机械工作面试经验分享，旨在为即将参加或有意向加入机械工程师岗位的求职者提供宝贵参考。内容涵盖了从面试前准备到面试后跟进的全过程，包括但不限于机械岗位的面试流程解析、常见技术问题的深度剖析与解答思路、过往项目案例的分享与讨论，以及行为面试问题的应对策略与技巧。此外，还融入了个人面试心得与反思，帮助读者从多个维度理解和准备面试。 适合人群： 机械工程、自动化、机电一体化等相关专业的应届毕业生及有一定工作经验的从业者； 对品牌有浓厚兴趣，希望进入其机械研发团队或相关技术支持部门的求职者； 正在寻求职业转型，希望向智能制造、自动化设备等领域发展的专业人才； 希望通过面试技巧提升，增强自身竞争力，争取更高职位或更好待遇的职场人士。
基于java的名城小区物业管理系统开题报告.docx
09-25
基于java的名城小区物业管理系统开题报告.docx
大规模的行人属性识别数据集
最新发布
09-25
大规模的行人属性识别数据集 数据说明： 该数据集是一个大规模的行人属性识别数据集，包含100,000张带有26个常用属性的行人图像。 该数据集含有约100，000个图像:训练集80，000个图像，验证集10，000个图像，测试集10，000个。每张图像有26个二进制属性注释。
基于Vue框架的智能考勤系统设计源码
09-25
该项目是一款基于Vue框架开发的智能考勤系统源码，汇集了752个文件，涵盖JavaScript、Vue、TypeScript、Java、CSS、HTML等多种编程语言。代码结构清晰，包含282个JavaScript文件、104个Vue组件文件、74个TypeScript类型定义文件、59个JSON配置文件、57个Markdown文档、50个Java类文件、22个SCSS样式文件、14个PNG图片文件、13个资源映射文件、8个CommonJS模块文件。该系统旨在实现智能化的考勤管理，适用于各类企业和机构。
基于SSM架构和Maven管理的超市便利店管理系统设计源码
09-25
该项目是一款采用SSM架构并利用Maven进行管理的超市便利店管理系统源码。该系统以Java为主要开发语言，辅以JavaScript和CSS进行界面设计，共计包含184个文件，其中Java源文件63个，XML配置文件27个，PNG图片27个，JavaScript文件23个，JSP页面21个，属性文件6个，CSS文件5个，JPG图片4个，GIF图片3个，以及1个Git忽略文件。系统功能全面，适用于超市便利店日常运营管理。
基于STM32CubeMX理念的MCS51 CircleMN单片机寄存器自动配置与代码自动生成工具设计源码
09-25
该项目是一款针对MCS51单片机的寄存器自动配置与代码自动生成工具，灵感来源于STM32CubeMX的设计理念。工具包含155个文件，包括23个DLL文件、22个QM文件、17个头文件、17个C++源文件、12个UI文件、9个列表文件、9个目标文件、6个C源文件、4个工程文件、4个A51文件。软件以C++为主要开发语言，辅以C和C++进行实现，旨在简化51单片机编程过程。
源享科技STM32学习开发板芯片资料74HC4052
09-25
源享科技STM32学习开发板芯片资料74HC4052
华为数字化转型实战-37页PPT
09-25
华为数字化转型实战-37页PPT
基于JavaScript和微信小程序的劳务工小程序设计源码
09-25
该项目是一款基于JavaScript和微信小程序框架开发的劳务工管理小程序源码，包含942个文件，涵盖229个JavaScript文件、205个JSON配置文件、204个WXML模板文件、200个WXSS样式文件、78个PNG图片文件、17个WXS组件文件、6个SVG矢量图形文件、3个Markdown文档文件。该小程序专注于劳务工管理，适用于劳务工管理领域的各类需求。
Ubuntu 16.04手把手教你手动安装MongoDB教程
本教程详细介绍了如何在Ubuntu 16.04操作系统上手动安装MongoDB。以下是主要步骤： 1. **下载MongoDB**: - 打开系统自带的火狐浏览器，访问MongoDB官网下载页面： - 在Linux选项卡中，选择与Ubuntu 16.04相匹配的...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值