圖片分割爆炸效果

簡介

簡單實現下，模擬爆炸，這裏就簡單將圖片分成N塊，類似拼圖，完事，給予x方向和y方向一個加速度移動
這裏只是想到一種思路，就記錄下而已。至於怎麼炸，怎麼畫，加速度咋弄都是你的事了。

步驟

1.分割
我們給定每塊的大小，比如10，完事x，y方向每隔10就裁剪一塊圖片出來，
實體類，用來保存每個拼圖的位置

import android.graphics.Paint
import java.util.*

data class Ball(var x:Int,var y:Int,var accelarateX:Int,var accelarateY:Int=Random().nextInt(5)+10){
    val p=Paint(Paint.ANTI_ALIAS_FLAG)
    var width=0//拼圖的寬
    var heigth=0//拼圖的高
    var remove=false;
    //更新位置
    fun update(){
        x+=accelarateX
        y+=accelarateY
    }
    var xOLD=0
    var yOLD=0
    init {
        xOLD=x
        yOLD=y
    }
    //回覆初始值，方便多次使用
    fun reset(){
        x=xOLD
        y=yOLD
    }
}

2. 獲取Bitmap
   簡單對圖片進行下處理，防止圖片太大，內存溢出，根據具體情況做修改，非核心代碼，拿到bitmap即可

    private fun initSomeThing(){
        if(isInEditMode){
            return
        }
       // 對圖片進行處理，大於300的進行縮小，然後獲取到我們需要的圖片
        val res=R.drawable.imager
        val option=BitmapFactory.Options()
        option.inJustDecodeBounds=true
        BitmapFactory.decodeResource(resources, res,option)
        val w=option.outWidth
        val h=option.outHeight
        option.inSampleSize=1
        val wh=Math.max(w,h)
        if(wh>300){
            val size=Math.sqrt(h/300.00).roundToInt()
            option.inSampleSize=size
        }
        option.inJustDecodeBounds=false

         bitmap= BitmapFactory.decodeResource(resources, res,option)
        bpW=bitmap.width;
        bpH=bitmap.height;

        println("w/h========${bpW}/${bpH}=====${w}/$h")
    }

3.切割圖片
x,y方向上循環增加split對圖片進行切割，切割後的圖片是bp，完事保存在Ball的paint裏

    private fun initBalls(){
        thread {
            var x=0
            while(x<bpW){
                val xadd=Math.min(split,bpW-x)//防止超出圖片大小，會發生異常，
                var y=0
                while (y<bpH){
                    val yadd=Math.min(split,bpH-y)
                    val bp=Bitmap.createBitmap(bitmap,x,y,xadd,yadd)//獲取當前拼圖的圖片
                    var ball=Ball(x,y,Random().nextInt(20)-10).apply {
                        p.setShader(BitmapShader(bp,Shader.TileMode.REPEAT,Shader.TileMode.REPEAT))
                        this.width=xadd
                        this.heigth=yadd
                    }
                    balls.add(ball)
                    y+=split
                }
                x+=split
            }
            println("balls size============${balls.size}")
        }
    }

4.爆炸開始

    fun startExplode(){
        if(ballsClone.size>0){
            return //防止多次點擊，需要上次執行完畢纔可以繼續下一次
        }
        ballsClone.addAll(balls)//複製數據到另外一個集合裏
        postInvalidateOnAnimation()
    }

    override fun onDraw(canvas: Canvas) {
        super.onDraw(canvas)
        if (isInEditMode) {
            return
        }
        //圖片居中顯示
        val startX = (width - bpW) / 2f
        val startY = (height - bpH) / 2f
        if (ballsClone.size == 0) {//非爆炸期間直接顯示原圖即可
            canvas.drawBitmap(bitmap, startX, startY, null)
            return
        }
        var i = 0
        while (i < ballsClone.size) {
            val ball = ballsClone[i]
            canvas.save()
            canvas.translate(ball.x + startX, ball.y + startY)
//                canvas.drawRect(0f,0f,ball.width+0f,ball.heigth+0f,ball.p)
            canvas.drawCircle(ball.width / 2f, ball.heigth / 2f, Math.min(ball.width, ball.heigth) / 2f, ball.p)
            canvas.restore()
            ball.update()
            if (ball.x < -startX || ball.x > width || ball.y > height) {//跑到屏幕外邊的移除
                ballsClone.removeAt(i)
                ball.reset() //數據還原，下次使用
                i--
            }
            i++
        }
        postInvalidateOnAnimation()

    }

完整代碼

import android.content.Context
import android.graphics.*
import android.util.AttributeSet
import android.view.View
import com.charliesong.demo0327.R
import java.util.*
import kotlin.concurrent.thread
import kotlin.math.roundToInt

class ViewShowDot : View {
    constructor(context: Context?) : super(context) {
        initSomeThing()
    }

    constructor(context: Context?, attrs: AttributeSet?) : super(context, attrs) {
        initSomeThing()
    }

    constructor(context: Context?, attrs: AttributeSet?, defStyleAttr: Int) : super(context, attrs, defStyleAttr) {
        initSomeThing()
    }

    val ballsClone = arrayListOf<Ball>()//存儲所有的碎片
    val balls = arrayListOf<Ball>()//存儲所有的碎片
    var bpW = 0;//實際使用的圖片的寬
    var bpH = 0;//高
    val split = 5//間隔
    lateinit var bitmap: Bitmap
    private fun initSomeThing() {
        if (isInEditMode) {
            return
        }
        // 對圖片進行處理，大於300的進行縮小，然後獲取到我們需要的圖片
        val res = R.drawable.imager
        val option = BitmapFactory.Options()
        option.inJustDecodeBounds = true
        BitmapFactory.decodeResource(resources, res, option)
        val w = option.outWidth
        val h = option.outHeight
        option.inSampleSize = 1
        val wh = Math.max(w, h)
        if (wh > 300) {
            val size = Math.sqrt(h / 300.00).roundToInt()
            option.inSampleSize = size
        }
        option.inJustDecodeBounds = false

        bitmap = BitmapFactory.decodeResource(resources, res, option)
        bpW = bitmap.width;
        bpH = bitmap.height;

        println("w/h========${bpW}/${bpH}=====${w}/$h")
    }

    override fun onDraw(canvas: Canvas) {
        super.onDraw(canvas)
        if (isInEditMode) {
            return
        }
        //圖片居中顯示
        val startX = (width - bpW) / 2f
        val startY = (height - bpH) / 2f
        if (ballsClone.size == 0) {//非爆炸期間直接顯示原圖即可
            canvas.drawBitmap(bitmap, startX, startY, null)
            return
        }
        var i = 0
        while (i < ballsClone.size) {
            val ball = ballsClone[i]
            canvas.save()
            canvas.translate(ball.x + startX, ball.y + startY)
//                canvas.drawRect(0f,0f,ball.width+0f,ball.heigth+0f,ball.p)
            canvas.drawCircle(ball.width / 2f, ball.heigth / 2f, Math.min(ball.width, ball.heigth) / 2f, ball.p)
            canvas.restore()
            ball.update()
            if (ball.x < -startX || ball.x > width || ball.y > height) {//跑到屏幕外邊的移除
                ballsClone.removeAt(i)
                ball.reset() //數據還原，下次使用
                i--
            }
            i++
        }
        postInvalidateOnAnimation()

    }

    private fun initBalls() {
        thread {
            var x = 0
            while (x < bpW) {
                val xadd = Math.min(split, bpW - x)
                var y = 0
                while (y < bpH) {
                    val yadd = Math.min(split, bpH - y)
                    val bp = Bitmap.createBitmap(bitmap, x, y, xadd, yadd)
                    var ball = Ball(x, y, Random().nextInt(20) - 10).apply {
                        p.setShader(BitmapShader(bp, Shader.TileMode.REPEAT, Shader.TileMode.REPEAT))
                        this.width = xadd
                        this.heigth = yadd
                    }
                    balls.add(ball)
                    y += split
                }
                x += split
            }
            println("balls size============${balls.size}")
        }
    }

    override fun onAttachedToWindow() {
        super.onAttachedToWindow()
        balls.clear()
        initBalls()
    }

    override fun onDetachedFromWindow() {
        super.onDetachedFromWindow()
        repeat(balls.size) {
            val ball = balls[it]
            ball.p.reset()
        }
        balls.clear()
        if (!bitmap.isRecycled) {
            bitmap.recycle()
        }
    }

    fun startExplode() {
        if (ballsClone.size > 0) {
            return //防止多次點擊，需要上次執行完畢纔可以繼續下一次
        }
        ballsClone.addAll(balls)
        postInvalidateOnAnimation()
    }

}