首页 > 其他分享> > 基于Canvas的MyMathDraw[我的数学板][底部弹窗][API V6]

基于Canvas的MyMathDraw[我的数学板][底部弹窗][API V6]

2022-03-20 17:36:01 作者：互联网

1. 名称
2. 功能描述
3. app实现关键技巧
4. 源代码
5. build.gradle(Entry模块中的)
6. app截图
7. app运行视频（本地模拟器运行）

1. 名称

本次使用Canvas实现了一个绘制数学函数的app，命名为：我的数学板，MyMathDraw。
项目采用了parsii-4.0库，特此声明。
项目已经放置在Gitee仓库中：MyMathDraw。
本专栏关于使用开发语言的声明：全专栏专注于Java语言开发模式！
app图标：

在这里插入图片描述

2. 功能描述

具有一个底部弹窗，可以在弹出的设置小窗口中进行设置。
具有绘制函数的功能，输入数学函数，点击表情，即可在TextField中绘制图像。

在这里插入图片描述

3. app实现关键技巧

实现底部弹窗：本次app使用了StackLayout，最底层放置绘制的界面，最上层放置弹窗界面，其中弹窗界面上部分是灰色透明，下部分是圆角长方形弹窗，用于设置。默认情况，将其设置为HIDE即可，当用户点击左上角文字时，设置为VISIBLE，即可达到“弹窗”功能。
实现函数绘制：采用描点法绘制函数，密集的描点即可。其中对函数表达式采用parsii库提供的表达式解析功能，生成每个x对应的y值，放入ArrayList中。

4. 源代码

4.1 java源代码

4.1.1 MainAbilitySlice.java

package com.tdtxdcxm.mymathdraw.slice;

import com.tdtxdcxm.mymathdraw.ResourceTable;
import ohos.aafwk.ability.AbilitySlice;
import ohos.aafwk.content.Intent;
import ohos.agp.colors.RgbColor;
import ohos.agp.components.*;
import ohos.agp.components.element.ShapeElement;
import ohos.agp.render.Canvas;
import ohos.agp.render.Paint;
import ohos.agp.utils.Color;
import parsii.eval.Expression;
import parsii.eval.Parser;
import parsii.eval.Scope;
import parsii.eval.Variable;
import parsii.tokenizer.ParseException;

import java.util.ArrayList;

public class MainAbilitySlice extends AbilitySlice {

    DirectionalLayout rootdl_stkl_ddl2,rootdl_stkl_ddl2_set;
    Button topdl_but;

    TextField bottomdl_tfd;

    Text topdl_txt,paintswitch_text,uiswitch_text;
    Switch switch_paintcolor,switch_uicolor;

    Paint bluepaint = new Paint();
    Paint purplepaint = new Paint();

    Paint paint = bluepaint;//用于绘制任务的默认画笔（蓝色）
    int origin_x,origin_y;

    boolean isgeneratexy = false;

    public void initPaint(){
        bluepaint.setColor(Color.BLUE);
        bluepaint.setStrokeWidth(8);

        purplepaint.setColor(new Color(Color.rgb(160, 32, 240)));
        purplepaint.setStrokeWidth(8);
    }

    public void initMASComponents(){
        topdl_txt = (Text) findComponentById(ResourceTable.Id_topdl_txt);
        topdl_but = (Button) findComponentById(ResourceTable.Id_topdl_but);
        bottomdl_tfd = (TextField) findComponentById(ResourceTable.Id_bottomdl_tfd);


        rootdl_stkl_ddl2 = (DirectionalLayout) findComponentById(ResourceTable.Id_rootdl_stkl_ddl2);
        rootdl_stkl_ddl2_set = (DirectionalLayout) findComponentById(ResourceTable.Id_rootdl_stkl_ddl2_set);

        paintswitch_text = (Text) findComponentById(ResourceTable.Id_paintswitch_text);
        uiswitch_text = (Text) findComponentById(ResourceTable.Id_uiswitch_text);

        switch_paintcolor = (Switch) findComponentById(ResourceTable.Id_switch_paintcolor);
        switch_uicolor = (Switch) findComponentById(ResourceTable.Id_switch_uicolor);

        bottomdl_tfd.setHint("输入函数>>>"+"\n【右上角表情】：\n1.单击—绘制"+"\n2.长按-清空");


        topdl_txt.setClickedListener(new Component.ClickedListener() {
            @Override
            public void onClick(Component component) {
                bottomdl_tfd.clearFocus();
                rootdl_stkl_ddl2.setVisibility(Component.VISIBLE);
                if(topdl_but.getText().equals("标签：Canvas,MyMathDraw,ohos,Component,API,text,import,new,public	

来源： https://www.cnblogs.com/TDTX/p/16030631.html