从活动中单击时更改片段画布上的颜色

时间:2018-05-07 09:37:59

标签: android-fragments kotlin

我正在制作一个儿童应用程序,孩子可以在上面看到一本书上的指纹。

Sample Image

主视图不是ImageView。相反,它是一个自定义视图,从GLSurfaceView扩展到翻转页面时允许pagecurl动画。为了制作画布,当点击一个蜡笔时,我的代码会启动一个透明布局的片段,以便在自定义视图的顶部进行绘制。

适用于每种单独的颜色。但是当点击一个新颜色时,旧线被删除(因为启动了一个新片段),我可以使用新颜色再次绘制。

然而,理想的行为是保留旧图形(使用以前的颜色),并且用户应该能够继续使用新颜色进行绘制,而不会重新启动片段。

作为测试,我现在只使用前3种颜色。

在DrawingFragment中,我实际上已经能够通过调用方法changeColor以编程方式从片段(到CYAN)更改颜色。但是,我仍然需要从与每种颜色对应的Activity中获取click事件。

主要问题:

  • App应该只在第一个实例上启动一次片段 点击蜡笔。
  • 应用程序应识别片段是否已创建,如果已创建,则每次单击蜡笔时,将按钮单击事件从“活动”传递到“片段”。

我有一个模糊的想法,也许我应该使用一个界面,但我还没有完全理解它的作用。我对kotlin和android很新,任何帮助或建议都将不胜感激。

主要活动

class ReadBooksActivity : Activity() {

    var mCurlView: CurlView? = null
    var reading_toolbar : View? = null
    var isUp = false
    var drawColor : Int? = null
    var isDrawing = false


    public override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.readbooks_layout)

        // Start Page Curl for each page

        mCurlView = findViewById(R.id.curl)
        mCurlView!!.setSizeChangedObserver(SizeChangedObserver())
        mCurlView!!.setCurrentIndex(index)

        var bookId = intent.getIntExtra("ID", 0)

        Thread(Runnable {
            fetchbookpages()
            mCurlView!!.setBitmapProvider(BitmapProvider(mBitmaps))
        }).start()


        mCurlView!!.setEnableTouchPressure(true)
        mCurlView!!.set2PagesLandscape(true)
        mCurlView!!.setAllowLastPageCurl(true)


        // Toggle Reading Toolbar

        reading_toolbar = findViewById(R.id.readingtoolbar) as View


        // Enable drawing on View


        tabtools.setOnClickListener(View.OnClickListener {
            showToolbar()
        })

        tabexit2.setOnClickListener(View.OnClickListener {
            hideToolbar()
        })

        tabexit.setOnClickListener(View.OnClickListener {
            onSlideViewButtonClick(reading_toolbar!!)
        })

    }

    fun buttonClicked(view: View) {

        //if (!isDrawing) {

            if (view.id == R.id.crayon_black) {
                drawColor = Color.BLACK
            } else if (view.id == R.id.crayon_blue) {
                drawColor = Color.BLUE
            } else if (view.id == R.id.crayon_green) {
                drawColor = Color.GREEN
            }

            callDrawFragment(drawColor!!)
       // }

       // isDrawing = true
    }

    fun callDrawFragment(drawColor : Int) {

        val mFragment = DrawingFragment.newInstance(drawColor)

        fragmentManager!!
                .beginTransaction()
                .replace(R.id.mainreadinglayout, mFragment)
                .addToBackStack(null)
                .commit()
    }
    }

DrawingFragment

class DrawingFragment: Fragment() {

    var drawColor : Int? = null
    var drawingView : DrawingView? = null

    override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {

      val view = inflater.inflate(R.layout.drawing_layout, container, false)

        val relativeLayout = view.findViewById(R.id.draw_layout) as RelativeLayout

        drawColor = arguments.getInt("color")
        var drawingView = DrawingView(activity, drawColor!!)
        relativeLayout.addView(drawingView)
        changeColor(drawingView)

        return view
    }

    fun changeColor(view: DrawingView) {
        var currentPaint = Paint()
        currentPaint.setColor(Color.CYAN)
        currentPaint.isAntiAlias = true
        currentPaint.isDither = true
        currentPaint.style = Paint.Style.STROKE
        currentPaint.strokeJoin = Paint.Join.ROUND
        currentPaint.strokeCap = Paint.Cap.ROUND
        currentPaint.strokeWidth = 10f
        view.setPaint(currentPaint)
    }

    companion object {

        fun newInstance(color: Int): DrawingFragment {

            val args = Bundle()
            args.putInt("color", color)
            val fragment = DrawingFragment()
            fragment.arguments = args
            return fragment
        }
    }
}

DrawingView

class DrawingView(context: Context, color : Int) : View(context) {

    var mPaint: Paint? = null
    val mPath: Path

    init {
        mPaint = Paint()
        mPaint!!.isAntiAlias = true
        mPaint!!.isDither = true
        mPaint!!.color = color
        mPaint!!.style = Paint.Style.STROKE
        mPaint!!.strokeJoin = Paint.Join.ROUND
        mPaint!!.strokeCap = Paint.Cap.ROUND
        mPaint!!.strokeWidth = 10f
        mPath = Path()
    }

    override fun onDraw(canvas: Canvas) {
        canvas.drawPath(mPath, mPaint)
        super.onDraw(canvas)
        canvas.drawColor(Color.TRANSPARENT)

    }

    fun setPaint(mPaint: Paint) {
        this.mPaint = mPaint
        return
    }

    override fun onTouchEvent(event: MotionEvent): Boolean {

        when (event.action) {

            MotionEvent.ACTION_DOWN -> mPath.moveTo(event.x, event.y)

            MotionEvent.ACTION_MOVE -> {
                mPath.lineTo(event.x, event.y)
                invalidate()
            }
            MotionEvent.ACTION_UP -> {
            }
        }

        return true
    }
}

1 个答案:

答案 0 :(得分:0)

我通过引用片段中的活动按钮来解决这个问题。

    var btn_black = (getActivity()).findViewById(R.id.crayon_black) as ImageView
    var btn_blue = (getActivity()).findViewById(R.id.crayon_blue) as ImageView
    var btn_green = (getActivity()).findViewById(R.id.crayon_green) as ImageView

然后在片段中设置onclick侦听器

btn_black.setOnClickListener(View.OnClickListener {
            changeColor(drawingView, Color.BLACK)
        })
btn_blue.setOnClickListener(View.OnClickListener {
            changeColor(drawingView, Color.BLUE)
        })
btn_green.setOnClickListener(View.OnClickListener {
            changeColor(drawingView, Color.GREEN)
        })

然后在backpressed上重新设置活动上的onclicklisteners。我还有booleanTag来表明片段是否已启动。

 override fun onBackPressed() {
        setColorOnClickListeners()
        booleanTag = "false"
        crayon_black.setTag(booleanTag)
        if (mCurlView!!.getIsUp()) {
            slideDown(reading_toolbar!!)
            mCurlView!!.setIsUp(!isUp)
        }

        super.onBackPressed()
    }

setcolorOnClicklistener()如下:

fun setColorOnClickListeners() {
        crayon_black.setOnClickListener(View.OnClickListener {
            buttonClicked(crayon_black)
        })
        crayon_blue.setOnClickListener(View.OnClickListener {
            buttonClicked(crayon_blue)
        })
// etc...
}

buttonClicked:

fun buttonClicked(view: View) {

        booleanTag = crayon_black.tag as String

        if (booleanTag == "false") {

            if (view.id == R.id.crayon_black) {
                drawColor = Color.BLACK
            } else if (view.id == R.id.crayon_blue) {
                drawColor = Color.BLUE
            } else if (view.id == R.id.crayon_green) {
                drawColor = Color.GREEN
            } else if (view.id == R.id.crayon_orange) {
                drawColor = Color.parseColor("#FFA500")
            } else if (view.id == R.id.crayon_pink) {
                drawColor = Color.parseColor("#ec5db8")
            } else if (view.id == R.id.crayon_red) {
                drawColor = Color.RED
            } else if (view.id == R.id.crayon_violet) {
                drawColor = Color.parseColor("#8862ba")
            } else if (view.id == R.id.crayon_white) {
                drawColor = Color.WHITE
            } else if (view.id == R.id.crayon_yellow) {
                drawColor = Color.YELLOW
            }


            callDrawFragment(drawColor!!)
            booleanTag = "true"
            crayon_black.setTag(booleanTag)
        }

    }

还需要在DrawingView上处理颜色变化的一些事情,但这解决了我的大多数问题。