国民技术
直播中

bukaopudemao

5年用户 20经验值
擅长:可编程逻辑 嵌入式技术 EMC/EMI设计 处理器/DSP 接口/总线/驱动 控制/MCU
私信 关注

【国民技术N32项目移植】自行车码表项目 4.项目提交

界面绘制

1.使用移植好的LVGL绘制界面,如下:

static void MeterDisplay_Init(void)
{
    lv_obj_t * scr = lv_scr_act();  //获取当前活跃的屏幕对象
    
    static lv_style_t style1,style2;
    lv_style_init(&style1);
    lv_style_set_size(&style1, LV_STATE_DEFAULT, 4);
    lv_style_set_bg_opa(&style1, LV_STATE_DEFAULT, LV_OPA_COVER);
    lv_style_set_bg_color(&style1, LV_STATE_DEFAULT, lv_color_hex3(0xeee));
    lv_style_set_radius(&style1, LV_STATE_DEFAULT, LV_RADIUS_CIRCLE);
    lv_style_set_pad_right(&style1, LV_STATE_DEFAULT, 4);
    lv_style_set_border_opa(&style1,LV_STATE_DEFAULT,0);
    lv_style_set_text_font(&style1,LV_STATE_DEFAULT,&lv_font_montserrat_46);    
    
    //弧形指示条
    arc1 = lv_arc_create(scr, NULL);
    lv_arc_set_bg_angles(arc1, 135, 45);
    lv_obj_set_size(arc1, 220, 220);
    lv_obj_align(arc1, NULL, LV_ALIGN_CENTER, 0, -20);
    lv_obj_add_style(arc1,LV_OBJ_PART_MAIN,&style1);
    //电量指示条
    bar1 = lv_bar_create(scr, NULL);
    lv_obj_set_size(bar1, 38, 8);
    lv_obj_set_style_local_bg_grad_color(bar1,LV_BAR_PART_INDIC,LV_STATE_DEFAULT,LV_COLOR_GREEN);
    lv_obj_set_style_local_bg_color(bar1,LV_BAR_PART_INDIC,LV_STATE_DEFAULT,LV_COLOR_ORANGE);
    lv_obj_set_style_local_bg_grad_dir(bar1,LV_BAR_PART_INDIC,LV_STATE_DEFAULT,LV_GRAD_DIR_HOR);
    lv_obj_align(bar1, arc1, LV_ALIGN_OUT_TOP_RIGHT, 0, 10); 
	lv_obj_set_style_local_radius(bar1,LV_BAR_PART_INDIC,LV_STATE_DEFAULT,0);
    lv_obj_set_style_local_radius(bar1,LV_BAR_PART_BG,LV_STATE_DEFAULT,0);
    lv_obj_add_style(bar1,LV_OBJ_PART_MAIN,&style2);
    lv_bar_set_anim_time(bar1, 100);
    //速度值显示
    Speed_Label = lv_label_create(arc1,NULL);
    lv_obj_set_style_local_text_font(Speed_Label,LV_LABEL_PART_MAIN,LV_STATE_DEFAULT,&lv_font_montserrat_46);
    lv_obj_align(Speed_Label,arc1,LV_ALIGN_IN_BOTTOM_MID,0,-50);
    //速度单位显示
    lv_obj_t * Speed_Label2 = lv_label_create(arc1,NULL);
    lv_label_set_text_fmt(Speed_Label2,"Km");
    lv_obj_set_style_local_text_font(Speed_Label2,LV_LABEL_PART_MAIN,LV_STATE_DEFAULT,&lv_font_montserrat_36);
    lv_obj_align(Speed_Label2,Speed_Label,LV_ALIGN_OUT_BOTTOM_MID,0,-10);
    //里程显示
    lv_obj_t * Trip_LabA = lv_label_create(scr,NULL);
    lv_label_set_text_fmt(Trip_LabA,"Trip:");
    lv_obj_set_style_local_text_font(Trip_LabA,LV_LABEL_PART_MAIN,LV_STATE_DEFAULT,&lv_font_montserrat_24);
    lv_obj_align(Trip_LabA,Speed_Label2,LV_ALIGN_OUT_BOTTOM_MID,-60,20);
    Trip_LabVal = lv_label_create(scr,NULL);
    lv_obj_set_style_local_text_font(Trip_LabVal,LV_LABEL_PART_MAIN,LV_STATE_DEFAULT,&lv_font_montserrat_24);
    lv_obj_set_style_local_text_color(Trip_LabVal,LV_LABEL_PART_MAIN,LV_STATE_DEFAULT,LV_COLOR_BLUE);
    lv_obj_align(Trip_LabVal,Trip_LabA,LV_ALIGN_OUT_RIGHT_MID,0,0);
    //运行时间
    RunTime_LabA = lv_label_create(scr,NULL);
    lv_obj_set_style_local_text_font(RunTime_LabA,LV_LABEL_PART_MAIN,LV_STATE_DEFAULT,&lv_font_montserrat_24);
    lv_obj_align(RunTime_LabA,Trip_LabA,LV_ALIGN_OUT_BOTTOM_LEFT,0,10);

    lv_task_create(ScrRefreshData,30,LV_TASK_PRIO_MID,NULL);
    lv_task_create(Get_Trip_and_Runtime,1000,LV_TASK_PRIO_MID,NULL);
    lv_task_create(Get_Battery_Quantity_Electric,2000,LV_TASK_PRIO_MID,NULL);
}

由此,一个简单的界面就完成了,在函数最下方创建了3个任务,分别是屏幕内数据的更新,里程和运行时间的累计,以及通过ADC获取电池的电量,
2.速度的计算可以通过定时器的捕获中断获取,利用freertos发送任务通知实时更新,这里为了拍摄演示就取巧一下,通过软件定时器更改速度,再建立一个LVGL速度获取任务,任务内容就为速度自增:

void Get_Speed_Val(void)
{
    Speed_Val += 5;
    if(Speed_Val >= 500)
        Speed_Val = 0;
}

3.提交代码:*附件:n32-g455-tft.zip拍摄:

国民技术自行车码表项目

回帖(1)

jf_53968515

2023-3-8 13:59:42
为什么我用的时候就只有阶梯一样一条条的线,只有打点才行,能看看你的源码吗?
举报

更多回帖

发帖
×
20
完善资料,
赚取积分