Sliding image 4x4 with GridLayout

Question

I want ask about sliding image puzzle. below is code for slide to left or right. but I have a problem.

  if (i + 1 < imageviews.size) {
                if (imageviews[i + 1]!!.drawable == null) {
                    mGridLayout.removeView(imageviews[i + 1])
                    mGridLayout.addView(imageviews[i + 1], i)
                    val temp = imageviews[i + 1]
                    imageviews[i + 1] = imageviews[i]
                    imageviews[i] = temp
                }
            }
            if (i - 1 >= 0) {
                if (imageviews[i - 1]!!.drawable == null) {
                    mGridLayout.removeView(imageviews[i - 1])
                    mGridLayout.addView(imageviews[i - 1], i)
                    val temp = imageviews[i - 1]
                    imageviews[i - 1] = imageviews[i]
                    imageviews[i] = temp
                }
            }

before do anything:

Answer 1

I have updated setOnClickListener() function and it seems to be working but I haven't solved it completely:

private fun setOnClickListener() {
    Log.i(TAG, "${imageviews.size} ")
    for (i in 0 until imageviews.size step 1) {
        imageviews[i]!!.setOnClickListener {
            Log.i(TAG, "${imageviews.size} $i")

            val top: Int? = if (i - GRID_NO >= 0) i - GRID_NO else null
            val bottom: Int? = if (i + GRID_NO < imageviews.size) i + GRID_NO else null
            val left: Int? = if (i % GRID_NO > 0) i - 1 else null
            val right: Int? = if (i % GRID_NO < GRID_NO - 1) i + 1 else null

            // Log.i(TAG, "Top: $top Bottom: $bottom Left: $left Right: $right")

            if (top != null && imageviews[top]!!.drawable == null) {
                imageviews[top]!!.setImageDrawable(imageviews[i]!!.drawable)
                mGridLayout.removeViewAt(i)
                mGridLayout.addView(imageviews[i], i)
                imageviews[i]!!.setImageDrawable(null)
            } else if (bottom != null && imageviews[bottom]!!.drawable == null) {
                imageviews[bottom]!!.setImageDrawable(imageviews[i]!!.drawable)
                mGridLayout.removeViewAt(i)
                mGridLayout.addView(imageviews[i], i)
                imageviews[i]!!.setImageDrawable(null)
            } else if (left != null && imageviews[left]!!.drawable == null) {
                imageviews[left]!!.setImageDrawable(imageviews[i]!!.drawable)
                mGridLayout.removeViewAt(i)
                mGridLayout.addView(imageviews[i], i)
                imageviews[i]!!.setImageDrawable(null)
            } else if (right != null && imageviews[right]!!.drawable == null) {
                imageviews[right]!!.setImageDrawable(imageviews[i]!!.drawable)
                mGridLayout.removeViewAt(i)
                mGridLayout.addView(imageviews[i], i)
                imageviews[i]!!.setImageDrawable(null)
            }
            if (isSolved()) {
                Toast.makeText(this, "Success , true", Toast.LENGTH_SHORT).show()
            }
        }
    }
}

UPDATED isSolved() FUNCTION UPON REQUEST

Updated isSolved() looks like as follows:

private fun isSolved(): Boolean {
    var solved = true
    for (i in 0 until GRID_NO) {
        for (j in 0 until GRID_NO) {
            val index: Int = i * GRID_NO + j
            if (imageviews[index]!!.drawable == null) {
                continue
            } else if (imageviews[index]!!.drawable != imageViews[i][j]!!.drawable) {
                solved = false
                break
            }
        }
    }
    return solved
}

Please note that this version returns true if all cells except the empty cell in correct place, meaning that empty cell can be any cell at the end. If these kind of puzzles normally have more restricted success rules, like the empty cell should be on the corners, it needs to be updated.