设置页面设计

目录结构

-src	
    -pages
    	-screen_saver							   // 屏保
    		-screen_saver_anim_planet.c			    // 行星动画
    		-screen_saver_anim.c				   // 屏保动画
    		-screen_saver_galaxy_anim.c			    // 星系动画
    		-screen_saver_galaxy_clock.c		    // 星系时钟
    		-screen_saver_real_time_weather.c		// 实时天气
    		-screen_saver_simple_clock.c			// 简易时钟
    		-screen_saver.c						   // 屏保
    	-settings
    		-setting_about_this_machine_page.c		  //关于本机
    		-setting_common.c
    		-setting_common.h					     //放置通用方法
    		-setting_locate_room_page.c				  //所在房间
    		-setting_locate_room_start_match.c		   //所在房间开始匹配
    		-setting_my_screen_saver.c				   //屏保样式选择 页面
    		-setting_proximity_wake_up.c			   //靠近亮屏
    		-setting_screen_brightness.c			   //屏保亮度
    		-setting_screen_enter_sleep_time.c			//自动进入屏保
    		-setting_screen_save_list_page.c		    //屏保设置 主页面
    		-setting_screen_saver_complex_function.c	//屏保 复杂功能
    		-setting_screen_saver.c					   //屏保3级页面
    		-setting_volume_page.c					   //提示音量
    -setting_page.c									  // 设置一级页面

设置主页面

效果预览

思路

  1. 创建 设置 列表视图

      widget_t* win;
      widget_t* list_view = list_view_create(win, 32, 120, 416, 360);
      widget_t* scroll_bar = scroll_bar_create_mobile(list_view, 0, 0, 0, 0);//滚动条
      widget_t* scroll_view = scroll_view_create(list_view, 0, 0, 416, 360);//滚动视图
      ui_load_setting_list(scroll_view, (void*)&setting_list_data);//加载设置列表
    
  2. 加载设置列表,ui_load_setting_list

    void ui_load_setting_list(widget_t* list, void* data) {
        if (list == NULL || data == NULL) {
            return;
        }
    
        ui_component_data_t* list_data = (ui_component_data_t*)data;
        uint32_t size = list_data->size;
        ui_item_data_t* item_data = list_data->item_data;
    
        for (uint32_t i = 0; i < size; i++) {
            widget_t* list_item = list_item_create(list, 0, 0, 416, 96);
    
            widget_t* button = button_create(list_item, 0, 0, 416, 80);
            widget_set_style_color(button, "normal:bg_color", 0xff1f1f1f);
    #if !defined(AWTK_NOT_ROUND_RADIUS)
            widget_set_style_int(button, "normal:round_radius", 40);
    #endif
            widget_set_style_color(button, "pressed:bg_color", 0xff1f1f1f);
    #if !defined(AWTK_NOT_ROUND_RADIUS)
            widget_set_style_int(button, "pressed:round_radius", 40);
    #endif
            widget_set_style_color(button, "over:bg_color", 0xff1f1f1f);
    #if !defined(AWTK_NOT_ROUND_RADIUS)
            widget_set_style_int(button, "over:round_radius", 40);
    #endif
    
            widget_set_prop_str(button, "next_win", item_data[i].next_win);
    
            widget_t* icon = image_create(button, 24, 10, 64, 64);
            widget_set_style_str(icon, "normal:text_align_h", "center");
            widget_set_style_str(icon, "normal:text_align_v", "middle");
            widget_set_style_str(icon, "normal:font_name", "icomoon");
            widget_set_style_int(icon, "normal:font_size", 64);
            widget_set_style_color(icon, "normal:text_color", 0xffffffff);
            widget_set_text_utf8(icon, item_data[i].icon_name);
    
            widget_t* label = label_create(button, 100, 0, 112, 80);
            widget_set_style_str(label, "normal:text_align_h", "center");
            widget_set_style_str(label, "normal:text_align_v", "middle");
            widget_set_style_str(label, "normal:font_name", "NotoSansSC_Regular");
            widget_set_style_int(label, "normal:font_size", 28);
            widget_set_style_color(label, "normal:text_color", 0xffffffff);
            widget_set_text_utf8(label, item_data[i].text);
    
            widget_on(button, EVT_CLICK, on_button, button);
        }
    }
    
  3. 组装设置列表数据

    static ui_item_data_t setting_list_item_data[6] = {
      [0] = {
        .icon_name = ui_icon_wallpaper,
        .text = "屏保设置",
        .next_win = "setting_screen_save_list_page",
      },
      [1] = {
        .icon_name = ui_icon_brightness,
        .text = "屏保亮度",
        .next_win = "setting_screen_brightness_page",
      },
      [2] = {
        .icon_name = ui_icon_sound,
        .text = "提示音量",
        .next_win = "setting_volume_page",
      },
      [3] = {
        .icon_name = ui_icon_nearby_response,
        .text = "靠近亮屏",
        .next_win = "setting_proximity_wake_up_page",
      },
      [4] = {
        .icon_name = ui_icon_sofa,
        .text = "所在房间",
        .next_win = "setting_locate_room_page",
      },
      [5] = {
        .icon_name = ui_icon_tips,
        .text = "关于本机",
        .next_win = "setting_about_this_machine_page",
      },
    };
    
    static ui_component_data_t setting_list_data = {
      .item_data = setting_list_item_data,
      .size = 6,
    };
    

    数据列表结构体

    typedef struct {
      uint32_t value;
      const char* icon_name;/* 字体图标名称 */
      const char* text;		/* 文本 */
      const char* text2;	/* 文本2 */
      const char* text3;	/* 文本3 */
      const char* next_win; /* 指向的下一级页面 */
    } ui_item_data_t;
    
    typedef struct
    {
        ui_item_data_t *item_data;	/* item数据 */
        uint32_t size;			   /* item数量 */
    } ui_component_data_t;
    
  4. 字体图标宏定义

    ///设置
    #define ui_icon_wallpaper       "䠁"
    #define ui_icon_brightness      "䜡"
    #define ui_icon_sound           "䞑"
    #define ui_icon_nearby_response "䝤"
    #define ui_icon_sofa            "䠵"
    #define ui_icon_tips            "䞕"
    #define ui_icon_arrow_right     "䜓"
    #define ui_icon_automatic       "䜔"
    #define ui_icon_power_switch    "䝵"
    

实现

// src/pages/setting_page.c

#include "awtk.h"
#include "../common/navigator.h"
#include "../common/ui_widget.h"
#include "../common/ui_page_load.h"
#include "../common/ui_cache_data.h"
#include "../common/ui_font_icon.h"

#include "scroll_view/list_view.h"
#include "scroll_view/scroll_bar.h"
#include "scroll_view/scroll_view.h"

#include "ui_colmo_knob_common.h"

static ui_item_data_t setting_list_item_data[6] = {
  [0] = {
    .icon_name = ui_icon_wallpaper,
    .text = "屏保设置",
    .next_win = "setting_screen_save_list_page",
  },
  [1] = {
    .icon_name = ui_icon_brightness,
    .text = "屏保亮度",
    .next_win = "setting_screen_brightness_page",
  },
  [2] = {
    .icon_name = ui_icon_sound,
    .text = "提示音量",
    .next_win = "setting_volume_page",
  },
  [3] = {
    .icon_name = ui_icon_nearby_response,
    .text = "靠近亮屏",
    .next_win = "setting_proximity_wake_up_page",
  },
  [4] = {
    .icon_name = ui_icon_sofa,
    .text = "所在房间",
    .next_win = "setting_locate_room_page",
  },
  [5] = {
    .icon_name = ui_icon_tips,
    .text = "关于本机",
    .next_win = "setting_about_this_machine_page",
  },
};

static ui_component_data_t setting_list_data = {
  .item_data = setting_list_item_data,
  .size = 6,
};

extern void setting_back_to_home_gesture_event_regist(widget_t* win);

static ret_t on_back(void* ctx, event_t* e) {
  navigator_back();
  return RET_OK;
}

/* 初始化主页面 */
static ret_t init_setting_page(widget_t* win) {
  widget_set_style_color(win, "normal:bg_color", 0xff000000);

  /* 窗体动画 */
  widget_set_prop_str(win, WIDGET_PROP_ANIM_HINT, "vtranslate(duration=500,easing=cubic_out)");

  widget_t* back = button_create(win, 168, 54, 40, 40);
  widget_set_text_utf8(back, ui_icon_back_image_font);
  widget_set_style_str(back, "normal:font_name", "icomoon");
  widget_set_style_int(back, "normal:font_size", 40);
  widget_set_style_color(back, "normal:text_color", 0x66ffffff);
  widget_set_style_str(back, "over:font_name", "icomoon");
  widget_set_style_int(back, "over:font_size", 40);
  widget_set_style_color(back, "over:text_color", 0x66ffffff);
  widget_set_style_str(back, "pressed:font_name", "icomoon");
  widget_set_style_int(back, "pressed:font_size", 40);
  widget_set_style_color(back, "pressed:text_color", 0x66ffffff);
  widget_on(back, EVT_CLICK, on_back, win);

  widget_t* label = label_create(win, 208, 56, 64, 32);
  widget_set_style_str(label, "normal:text_align_h", "center");
  widget_set_style_str(label, "normal:text_align_v", "middle");
  widget_set_style_str(label, "normal:font_name", "NotoSansSC_Regular");
  widget_set_style_int(label, "normal:font_size", 32);
  widget_set_style_color(label, "normal:text_color", 0xffffffff);
  widget_set_text_utf8(label, "设置");

  widget_t* list_view = list_view_create(win, 32, 120, 416, 360);
  widget_t* scroll_bar = scroll_bar_create_mobile(list_view, 0, 0, 0, 0);
  widget_t* scroll_view = scroll_view_create(list_view, 0, 0, 416, 360);
  ui_load_setting_list(scroll_view, (void*)&setting_list_data);

  return RET_OK;
}

/**
 * 初始化窗口的子控件
 */
static ret_t visit_init_child(void* ctx, const void* iter) {
  widget_t* win = WIDGET(ctx);
  widget_t* widget = WIDGET(iter);
  const char* name = widget->name;

  // 初始化指定名称的控件(设置属性或注册事件),请保证控件名称在窗口上唯一
  if (name != NULL && *name != '\0') {

  }

  return RET_OK;
}

/* 去初始化主页面 */
static ret_t deinit_setting_page(void* ctx, event_t* e) {
  return RET_OK;
}

static void setting_page_event_regist(widget_t* win) {
  widget_on(win, EVT_WINDOW_CLOSE, deinit_setting_page, win);
}

/**
 * 初始化窗口
 */
ret_t setting_page_init(widget_t* win, void* ctx) {
  (void)ctx;
  return_value_if_fail(win != NULL, RET_BAD_PARAMS);

  init_setting_page(win);

  // widget_foreach(win, visit_init_child, win);

  setting_page_event_regist(win);
  setting_back_to_home_gesture_event_regist(win);

  return RET_OK;
}

屏保

行星动画

/*
	screen_saver_anim_planet.c
*/
#include "awtk.h"
#include "../../common/navigator.h"
#include "../../common/ui_widget.h"
#include "../../common/ui_page_load.h"
#include "../../common/ui_cache_data.h"
#include "../../common/ui_font_icon.h"

#include "ui_colmo_knob_common.h"


static ret_t close_window_on_event(void* ctx, event_t* e) {
  window_close(WIDGET(ctx));
  /* 释放资源 */
  image_manager_unload_unused(image_manager(), 0);
  font_manager_shrink_cache(font_manager(), 0);
  return RET_REMOVE;
}

ret_t open_screen_saver_ainm_planet(void* data, bool_t disable_anim) {
  const char* name = "screen_saver_ainm_planet";
  const char* planet_name = "screen_saver/sun";

  widget_t* overlay = window_create(window_manager(), 0, 0, 480, 480);
  widget_set_name(overlay, name);
  widget_set_style_color(overlay, "normal:bg_color", 0xff000000);

  widget_t* gauge_pointer_view = gauge_pointer_view_create(overlay, -46, -327, 572, 572);
  gauge_pointer_view_set_anchor(gauge_pointer_view, "0.5", "572px");
  widget_create_animator(gauge_pointer_view, "value(duration=2000,repeat_times=1,easing=quadratic_inout,from=180,to=60)");

  widget_t* image = image_create(gauge_pointer_view, 0, 0, 572, 572);
  widget_set_style_color(overlay, "normal:bg_color", 0xff000000);
  image_set_image(image, planet_name);
  image_set_draw_type(image, IMAGE_DRAW_CENTER);
  widget_create_animator(image, "opacity(duration=2000,repeat_times=1,easing=quadratic_inout,from=0,to=255)");
  widget_create_animator(image, "rotation(duration=30000,repeat_times=0,easing=linear,from=6.28,to=0)");

  widget_on(overlay, EVT_POINTER_MOVE, close_window_on_event, overlay);
  widget_on(overlay, EVT_POINTER_UP, close_window_on_event, overlay);
  widget_on(overlay, EVT_KEY_UP, close_window_on_event, overlay);

  return RET_OK;
}

static ret_t on_anim_end(void* ctx, event_t* e) {
  widget_t* win = WIDGET(ctx);
  window_manager_close_window_force(window_manager(), win);
  return RET_OK;
}

ret_t close_screen_saver_ainm_planet(bool_t disable_anim) {
    const char *name = "screen_saver_ainm";
    widget_t *win;
    widget_t *wm = window_manager();
    return_value_if_fail(name != NULL && *name != '\0', RET_BAD_PARAMS);

    win = widget_child(wm, name);
    return_value_if_fail(win != NULL, RET_FAIL);

    widget_destroy_animator(win, "open");

    if (disable_anim) {
        return window_manager_close_window_force(wm, win);
    } else {
        widget_create_animator(win, "opacity(name=close,duration=1500,easing=quadratic_inout,from=255,to=0)");
        widget_on(win, EVT_ANIM_END, on_anim_end, win);
    }

    return RET_OK;
}

屏保动画

/*
	screen_saver_anim.c
*/
#include "awtk.h"
#include "../../common/navigator.h"
#include "../../common/ui_widget.h"
#include "../../common/ui_page_load.h"
#include "../../common/ui_cache_data.h"
#include "../../common/ui_font_icon.h"

#include "ui_colmo_knob_common.h"


static ret_t close_window_on_event(void* ctx, event_t* e) {
  window_close(WIDGET(ctx));
  /* 释放资源 */
  image_manager_unload_unused(image_manager(), 0);
  font_manager_shrink_cache(font_manager(), 0);
  return RET_REMOVE;
}

ret_t open_screen_saver_ainm(void* data, bool_t disable_anim) {
    const char* name = "screen_saver_ainm";
    // const char* anim_image_name = "screen_saver/cloudy_r/cloudy_r_";
    // const char* anim_image_name = "screen_saver/fog_r/fog_r_";
    // const char* anim_image_name = "screen_saver/rain_big_r/rain_big_r_";
    // const char* anim_image_name = "screen_saver/rain_small_r/rain_small_r_";
    // const char* anim_image_name = "screen_saver/rain_big_r/rain_big_r_";
    // const char* anim_image_name = "screen_saver/snow_r/snow_r_";
    const char* anim_image_name = "screen_saver/sunny_night_r/sunny_night_r_";
    // const char* anim_image_name = "screen_saver/sunny_r/sunny_r_";
    // const char* anim_image_name = "screen_saver/wind_r/wind_r_";

    widget_t* overlay = overlay_create(window_manager(), 0, 0, 480, 480);
    widget_set_name(overlay, name);

    widget_t* image_anim = image_animation_create(overlay, 0, 0, 480, 480);
    image_animation_set_loop(image_anim, TRUE);
    image_animation_set_image(image_anim, anim_image_name);
    image_animation_set_interval(image_anim, 30);
    image_animation_set_delay(image_anim, 0);
    image_animation_set_auto_play(image_anim, TRUE);
    image_animation_set_range_sequence(image_anim, 0, 143);
    image_animation_play(image_anim);
    image_animation_set_format(image_anim, "%s%03d");

    widget_on(overlay, EVT_POINTER_MOVE, close_window_on_event, overlay);
    widget_on(overlay, EVT_POINTER_UP, close_window_on_event, overlay);
    widget_on(overlay, EVT_KEY_UP, close_window_on_event, overlay);

    return RET_OK;
}

static ret_t on_anim_end(void* ctx, event_t* e) {
  widget_t* win = WIDGET(ctx);
  window_manager_close_window_force(window_manager(), win);
  return RET_OK;
}

ret_t close_screen_saver_ainm(bool_t disable_anim) {
    const char *name = "screen_saver_ainm";
    widget_t *win;
    widget_t *wm = window_manager();
    return_value_if_fail(name != NULL && *name != '\0', RET_BAD_PARAMS);

    win = widget_child(wm, name);
    return_value_if_fail(win != NULL, RET_FAIL);

    widget_destroy_animator(win, "open");

    if (disable_anim) {
        return window_manager_close_window_force(wm, win);
    } else {
        widget_create_animator(win, "opacity(name=close,duration=1500,easing=quadratic_inout,from=255,to=0)");
        widget_on(win, EVT_ANIM_END, on_anim_end, win);
    }

    return RET_OK;
}

星系动画

/*
	screen_saver_galaxy_anim.c
*/
#include "awtk.h"
#include "../../common/navigator.h"
#include "../../common/ui_widget.h"
#include "../../common/ui_page_load.h"
#include "../../common/ui_cache_data.h"
#include "../../common/ui_font_icon.h"

#include "ui_colmo_knob_common.h"


static ret_t close_window_on_event(void* ctx, event_t* e) {
  window_close(WIDGET(ctx));
  /* 释放资源 */
  image_manager_unload_unused(image_manager(), 0);
  font_manager_shrink_cache(font_manager(), 0);
  return RET_REMOVE;
}

static void set_complex_icon(widget_t* image, ui_complex_type_e complex_type) {
  switch (complex_type) {
  case ui_complex_display_date:
    image_set_image(image, "ic_date");
    break;
  case ui_complex_display_week:
    image_set_image(image, "ic_week");
    break;
  case ui_complex_display_weather:
    image_set_image(image, "ic_weather");
    break;
  case ui_complex_display_indoor_temp:
    image_set_image(image, "ic_indoor_temp");
    break;
  case ui_complex_display_indoor_humidity:
    image_set_image(image, "ic_indoor_humidity");
    break;
  case ui_complex_display_outdoor_temp:
    image_set_image(image, "ic_outdoor_temp");
    break;
  case ui_complex_not_display:
    image_set_image(image, "");
    break;
  default:
    break;
  }
}

static void set_complex_label(widget_t* label, ui_complex_type_e complex_type) {
  char str[32];
  switch (complex_type) {
  case ui_complex_display_date:
    tk_snprintf(str, sizeof(str), "%02d.%02d", g_current_env_info.dt.month, g_current_env_info.dt.day);
    widget_set_text_utf8(label, str);
    break;
  case ui_complex_display_week:
    if (g_current_env_info.dt.wday == 0) {
      widget_set_text_utf8(label, "周日");
    }
    else if (g_current_env_info.dt.wday == 1) {
      widget_set_text_utf8(label, "周一");
    }
    else if (g_current_env_info.dt.wday == 2) {
      widget_set_text_utf8(label, "周二");
    }
    else if (g_current_env_info.dt.wday == 3) {
      widget_set_text_utf8(label, "周三");
    }
    else if (g_current_env_info.dt.wday == 4) {
      widget_set_text_utf8(label, "周四");
    }
    else if (g_current_env_info.dt.wday == 5) {
      widget_set_text_utf8(label, "周五");
    }
    else if (g_current_env_info.dt.wday == 6) {
      widget_set_text_utf8(label, "周六");
    }
    break;
  case ui_complex_display_weather:
    if (g_current_env_info.weather == ui_weather_cloudy) {
      widget_set_text_utf8(label, "多云");
    }
    else if (g_current_env_info.weather == ui_weather_fog) {
      widget_set_text_utf8(label, "雾天");
    }
    else if (g_current_env_info.weather == ui_weather_rain_big) {
      widget_set_text_utf8(label, "大雨");
    }
    else if (g_current_env_info.weather == ui_weather_rain_small) {
      widget_set_text_utf8(label, "小雨");
    }
    else if (g_current_env_info.weather == ui_weather_snow) {
      widget_set_text_utf8(label, "雪天");
    }
    else if (g_current_env_info.weather == ui_weather_sunny) {
      widget_set_text_utf8(label, "晴天");
    }
    else if (g_current_env_info.weather == ui_weather_wind) {
      widget_set_text_utf8(label, "有风");
    }
    break;
  case ui_complex_display_indoor_temp:
    tk_snprintf(str, sizeof(str), "%d℃", g_current_env_info.indoor_temp);
    widget_set_text_utf8(label, str);
    break;
  case ui_complex_display_indoor_humidity:
    tk_snprintf(str, sizeof(str), "%d%%", g_current_env_info.indoor_humidity);
    widget_set_text_utf8(label, str);
    break;
  case ui_complex_display_outdoor_temp:
    tk_snprintf(str, sizeof(str), "%d℃", g_current_env_info.outdoor_temp);
    widget_set_text_utf8(label, str);
    break;
  case ui_complex_not_display:
    widget_set_text_utf8(label, "");
    break;
  default:
    break;
  }
}

ret_t open_screen_saver_galaxy_ainm(void* data, bool_t disable_anim) {
  char str[64];
  const char* name = "saver_galaxy_ainm";

  ui_screen_saver_setting_t* saver_setting = (ui_screen_saver_setting_t*)data;

  widget_t* overlay = window_create(window_manager(), 0, 0, 480, 480);
  widget_set_name(overlay, name);
  widget_set_style_color(overlay, "normal:bg_color", 0xff000000);

  widget_t* gauge_pointer_view = gauge_pointer_view_create(overlay, -46, -327, 572, 572);
  gauge_pointer_view_set_anchor(gauge_pointer_view, "0.5", "572px");
  widget_create_animator(gauge_pointer_view, "value(duration=2000,repeat_times=1,easing=quadratic_inout,from=180,to=60)");

  widget_t* image = image_create(gauge_pointer_view, 0, 0, 572, 572);
  widget_set_style_color(overlay, "normal:bg_color", 0xff000000);
  tk_snprintf(str, sizeof(str), "screen_saver/%s", saver_setting->style_image);
  image_set_image(image, str);
  image_set_draw_type(image, IMAGE_DRAW_CENTER);
  widget_create_animator(image, "opacity(duration=2000,repeat_times=1,easing=quadratic_inout,from=0,to=255)");
  widget_create_animator(image, "rotation(duration=30000,repeat_times=0,easing=linear,from=6.28,to=0)");

  widget_t* digit_clock = digit_clock_create(overlay, 58, 128, 364, 164);
  widget_set_style_str(digit_clock, "normal:text_color", "COLMO-Mono-Bold");
  widget_set_style_int(digit_clock, "normal:font_size", 148);
  widget_set_style_color(digit_clock, "normal:text_color", 0xffffffff);
  widget_set_prop_str(digit_clock, "format", "hh:mm");


  ui_screen_saver_setting_t* screen_saver_setting = &g_ui_screen_saver_setting[3];

  widget_t* left_icon = image_create(overlay, 72, 308, 72, 72);
  image_set_draw_type(left_icon, IMAGE_DRAW_SCALE);
  set_complex_icon(left_icon, screen_saver_setting->left_complex);

  widget_t* left_label = label_create(overlay, 146, 316, 126, 56);
  widget_set_style_str(left_label, "normal:text_align_h", "left");
  widget_set_style_str(left_label, "normal:text_align_v", "middle");
  widget_set_style_str(left_label, "normal:font_name", "NotoSansSC_Regular");
  widget_set_style_int(left_label, "normal:font_size", 32);
  widget_set_style_color(left_label, "normal:text_color", 0xffffffff);
  set_complex_label(left_label, screen_saver_setting->left_complex);

  widget_t* right_icon = image_create(overlay, 257, 308, 72, 72);
  image_set_draw_type(right_icon, IMAGE_DRAW_SCALE);
  set_complex_icon(right_icon, screen_saver_setting->right_complex);

  widget_t* right_label = label_create(overlay, 331, 316, 126, 56);
  widget_set_style_str(right_label, "normal:text_align_h", "left");
  widget_set_style_str(right_label, "normal:text_align_v", "middle");
  widget_set_style_str(right_label, "normal:font_name", "NotoSansSC_Regular");
  widget_set_style_int(right_label, "normal:font_size", 32);
  widget_set_style_color(right_label, "normal:text_color", 0xffffffff);
  set_complex_label(right_label, screen_saver_setting->right_complex);

  widget_t* line = view_create(overlay, 240, 320, 1, 48);
  widget_set_style_color(line, "normal:bg_color", 0xffffffff);

  widget_on(overlay, EVT_POINTER_MOVE, close_window_on_event, overlay);
  widget_on(overlay, EVT_POINTER_UP, close_window_on_event, overlay);
  widget_on(overlay, EVT_KEY_UP, close_window_on_event, overlay);

  return RET_OK;
}

static ret_t on_anim_end(void* ctx, event_t* e) {
  widget_t* win = WIDGET(ctx);
  window_manager_close_window_force(window_manager(), win);
  return RET_OK;
}

ret_t close_screen_saver_galaxy_ainm(bool_t disable_anim) {
    const char *name = "saver_galaxy_ainm";
    widget_t *win;
    widget_t *wm = window_manager();
    return_value_if_fail(name != NULL && *name != '\0', RET_BAD_PARAMS);

    win = widget_child(wm, name);
    return_value_if_fail(win != NULL, RET_FAIL);

    widget_destroy_animator(win, "open");

    if (disable_anim) {
        return window_manager_close_window_force(wm, win);
    } else {
        widget_create_animator(win, "opacity(name=close,duration=1500,easing=quadratic_inout,from=255,to=0)");
        widget_on(win, EVT_ANIM_END, on_anim_end, win);
    }

    return RET_OK;
}

星系时钟

/*
	screen_saver_galaxy_clock.c
*/
#include "awtk.h"
#include "../../common/navigator.h"
#include "../../common/ui_widget.h"
#include "../../common/ui_page_load.h"
#include "../../common/ui_cache_data.h"
#include "../../common/ui_font_icon.h"

#include "../../common/ui_anim/ui_anim.h"

#include "ui_colmo_knob_common.h"


static ret_t close_window_on_event(void* ctx, event_t* e) {
  window_close(WIDGET(ctx));
  /* 释放资源 */
  image_manager_unload_unused(image_manager(), 0);
  font_manager_shrink_cache(font_manager(), 0);
  return RET_REMOVE;
}

ret_t open_screen_saver_galaxy_clock(void* data, bool_t disable_anim) {
    char str[64];
    const char* name = "saver_galaxy_clock";

    ui_screen_saver_setting_t* saver_setting = (ui_screen_saver_setting_t*)data;

    widget_t* overlay = overlay_create(window_manager(), 0, 0, 480, 480);
    widget_set_name(overlay, name);
    widget_set_style_color(overlay, "normal:bg_color", 0xff000000);

    widget_t* galaxy_bg = image_create(overlay, 40, 40, 400, 400);
    image_set_image(galaxy_bg, "screen_saver/galaxy_bg");

    widget_t* whole_bg = image_create(overlay, 0, 0, 480, 480);
    tk_snprintf(str, sizeof(str), "screen_saver/%s", saver_setting->style_image);
    image_set_image(whole_bg, str);

    widget_t* digit_clock = digit_clock_create(overlay, 162, 208, 156, 64);
    widget_set_style_str(digit_clock, "normal:font_name", "COLMO-Mono-Bold");
    widget_set_style_color(digit_clock, "normal:text_color", 0xffffffff);
    widget_set_style_int(digit_clock, "normal:font_size", 64);
    digit_clock_set_format(digit_clock, "hh:mm");

    widget_t* time_clock = time_clock_view_create(overlay, 0, 0, 480, 480);
    time_clock_view_set_hour_radius(time_clock, 104);
    time_clock_view_set_minute_radius(time_clock, 136);
    time_clock_view_set_second_radius(time_clock, 168);

    widget_t* hour = image_create(time_clock, 0, 0, 102, 102);
    widget_set_name(hour, "hour");
    image_set_image(hour, "screen_saver/sun_clock_hour");
    image_set_draw_type(hour, IMAGE_DRAW_CENTER);
    widget_create_animator(hour, "rotation(duration=3000,repeat_times=0,easing=linear,from=0,to=6.283)");

    widget_t* minute = image_create(time_clock, 0, 0, 102, 102);
    widget_set_name(minute, "minute");
    image_set_image(minute, "screen_saver/earth_clock_min");
    image_set_draw_type(minute, IMAGE_DRAW_CENTER);
    widget_create_animator(minute, "rotation(duration=3000,repeat_times=0,easing=linear,from=0,to=6.283)");

    widget_t* second = image_create(time_clock, 0, 0, 102, 102);
    widget_set_name(second, "second");
    image_set_image(second, "screen_saver/moon_clock_sec");
    image_set_draw_type(second, IMAGE_DRAW_CENTER);
    widget_create_animator(second, "rotation(duration=3000,repeat_times=0,easing=linear,from=0,to=6.283)");

    if (disable_anim == FALSE) {
        ui_anim_scale_create(digit_clock, 0.7, 1.0, 1000);
        ui_anim_alpha_create(digit_clock, 0.0, 1.0, 1000);

        widget_create_animator(galaxy_bg, "opacity(name=open,duration=1000,easing=quadratic_inout,from=0,to=255)");

        widget_create_animator(time_clock, "opacity(name=open,duration=1000,easing=quadratic_inout,from=0,to=255)");
        widget_create_animator(time_clock, "hour_radius(name=open,duration=1000,easing=quadratic_inout,from=0,to=104)");
        widget_create_animator(time_clock, "minute_radius(name=open,duration=1000,easing=quadratic_inout,from=0,to=136)");
        widget_create_animator(time_clock, "second_radius(name=open,duration=1000,easing=quadratic_inout,from=0,to=168)");
        widget_create_animator(time_clock, "rad_offset(name=open,duration=1000,easing=quadratic_inout,from=-1.0,to=0)");
    }

    widget_on(overlay, EVT_POINTER_MOVE, close_window_on_event, overlay);
    widget_on(overlay, EVT_POINTER_UP, close_window_on_event, overlay);
    widget_on(overlay, EVT_KEY_UP, close_window_on_event, overlay);

    return RET_OK;
}

static ret_t on_anim_end(void* ctx, event_t* e) {
  widget_t* win = WIDGET(ctx);
  window_manager_close_window_force(window_manager(), win);
  return RET_OK;
}

ret_t close_screen_saver_galaxy_clock(bool_t disable_anim) {
    const char *name = "saver_galaxy_clock";
    widget_t *win;
    widget_t *wm = window_manager();
    return_value_if_fail(name != NULL && *name != '\0', RET_BAD_PARAMS);

    win = widget_child(wm, name);
    return_value_if_fail(win != NULL, RET_FAIL);

    widget_destroy_animator(win, "open");

    if (disable_anim) {
        return window_manager_close_window_force(wm, win);
    } else {
        widget_create_animator(win, "opacity(name=close,duration=1500,easing=quadratic_inout,from=255,to=0)");
        widget_on(win, EVT_ANIM_END, on_anim_end, win);
    }

    return RET_OK;
}

实时天气

/*
	screen_saver_real_time_weather.c
*/
#include "awtk.h"
#include "../../common/navigator.h"
#include "../../common/ui_widget.h"
#include "../../common/ui_page_load.h"
#include "../../common/ui_cache_data.h"
#include "../../common/ui_font_icon.h"

#include "ui_colmo_knob_common.h"


static ret_t close_window_on_event(void* ctx, event_t* e) {
  window_close(WIDGET(ctx));
  /* 释放资源 */
  image_manager_unload_unused(image_manager(), 0);
  font_manager_shrink_cache(font_manager(), 0);
  return RET_REMOVE;
}

static void set_complex_icon(widget_t* image, ui_complex_type_e complex_type) {
  switch (complex_type) {
  case ui_complex_display_date:
    image_set_image(image, "ic_date");
    break;
  case ui_complex_display_week:
    image_set_image(image, "ic_week");
    break;
  case ui_complex_display_weather:
    image_set_image(image, "ic_weather");
    break;
  case ui_complex_display_indoor_temp:
    image_set_image(image, "ic_indoor_temp");
    break;
  case ui_complex_display_indoor_humidity:
    image_set_image(image, "ic_indoor_humidity");
    break;
  case ui_complex_display_outdoor_temp:
    image_set_image(image, "ic_outdoor_temp");
    break;
  case ui_complex_not_display:
    image_set_image(image, "");
    break;
  default:
    break;
  }
}

static void set_complex_label(widget_t* label, ui_complex_type_e complex_type) {
  char str[32];
  switch (complex_type) {
  case ui_complex_display_date:
    tk_snprintf(str, sizeof(str), "%02d.%02d", g_current_env_info.dt.month, g_current_env_info.dt.day);
    widget_set_text_utf8(label, str);
    break;
  case ui_complex_display_week:
    if (g_current_env_info.dt.wday == 0) {
      widget_set_text_utf8(label, "周日");
    }
    else if (g_current_env_info.dt.wday == 1) {
      widget_set_text_utf8(label, "周一");
    }
    else if (g_current_env_info.dt.wday == 2) {
      widget_set_text_utf8(label, "周二");
    }
    else if (g_current_env_info.dt.wday == 3) {
      widget_set_text_utf8(label, "周三");
    }
    else if (g_current_env_info.dt.wday == 4) {
      widget_set_text_utf8(label, "周四");
    }
    else if (g_current_env_info.dt.wday == 5) {
      widget_set_text_utf8(label, "周五");
    }
    else if (g_current_env_info.dt.wday == 6) {
      widget_set_text_utf8(label, "周六");
    }
    break;
  case ui_complex_display_weather:
    if (g_current_env_info.weather == ui_weather_cloudy) {
      widget_set_text_utf8(label, "多云");
    }
    else if (g_current_env_info.weather == ui_weather_fog) {
      widget_set_text_utf8(label, "雾天");
    }
    else if (g_current_env_info.weather == ui_weather_rain_big) {
      widget_set_text_utf8(label, "大雨");
    }
    else if (g_current_env_info.weather == ui_weather_rain_small) {
      widget_set_text_utf8(label, "小雨");
    }
    else if (g_current_env_info.weather == ui_weather_snow) {
      widget_set_text_utf8(label, "雪天");
    }
    else if (g_current_env_info.weather == ui_weather_sunny) {
      widget_set_text_utf8(label, "晴天");
    }
    else if (g_current_env_info.weather == ui_weather_wind) {
      widget_set_text_utf8(label, "有风");
    }
    break;
  case ui_complex_display_indoor_temp:
    tk_snprintf(str, sizeof(str), "%d℃", g_current_env_info.indoor_temp);
    widget_set_text_utf8(label, str);
    break;
  case ui_complex_display_indoor_humidity:
    tk_snprintf(str, sizeof(str), "%d%%", g_current_env_info.indoor_humidity);
    widget_set_text_utf8(label, str);
    break;
  case ui_complex_display_outdoor_temp:
    tk_snprintf(str, sizeof(str), "%d℃", g_current_env_info.outdoor_temp);
    widget_set_text_utf8(label, str);
    break;
  case ui_complex_not_display:
    widget_set_text_utf8(label, "");
    break;
  default:
    break;
  }
}

ret_t open_screen_saver_real_time_weather(void* data, bool_t disable_anim) {
    const char* name = "saver_real_time_weather";
    // const char* anim_image_name = "screen_saver/cloudy_r/cloudy_r_";
    // const char* anim_image_name = "screen_saver/fog_r/fog_r_";
    // const char* anim_image_name = "screen_saver/rain_big_r/rain_big_r_";
    // const char* anim_image_name = "screen_saver/rain_small_r/rain_small_r_";
    // const char* anim_image_name = "screen_saver/rain_big_r/rain_big_r_";
    // const char* anim_image_name = "screen_saver/snow_r/snow_r_";
    const char* anim_image_name = "screen_saver/sunny_night_r/sunny_night_r_";
    // const char* anim_image_name = "screen_saver/sunny_r/sunny_r_";
    // const char* anim_image_name = "screen_saver/wind_r/wind_r_";

    widget_t* overlay = overlay_create(window_manager(), 0, 0, 480, 480);
    widget_set_style_color(overlay, "normal:bg_color", 0xff000000);
    widget_set_name(overlay, name);

    widget_t* image_anim = image_animation_create(overlay, 0, 0, 480, 480);
    image_animation_set_loop(image_anim, TRUE);
    image_animation_set_image(image_anim, anim_image_name);
    image_animation_set_interval(image_anim, 30);
    image_animation_set_delay(image_anim, 0);
    image_animation_set_auto_play(image_anim, TRUE);
    image_animation_set_range_sequence(image_anim, 0, 143);
    image_animation_play(image_anim);
    image_animation_set_format(image_anim, "%s%03d");

    widget_t* digit_clock = digit_clock_create(overlay, 58, 128, 364, 164);
    widget_set_style_str(digit_clock, "normal:text_color", "COLMO-Mono-Bold");
    widget_set_style_int(digit_clock, "normal:font_size", 148);
    widget_set_style_color(digit_clock, "normal:text_color", 0xffffffff);
    widget_set_prop_str(digit_clock, "format", "hh:mm");

    ui_screen_saver_setting_t* screen_saver_setting = &g_ui_screen_saver_setting[2];

    widget_t* left_icon = image_create(overlay, 72, 308, 72, 72);
    image_set_draw_type(left_icon, IMAGE_DRAW_SCALE);
    set_complex_icon(left_icon, screen_saver_setting->left_complex);

    widget_t* left_label = label_create(overlay, 146, 316, 126, 56);
    widget_set_style_str(left_label, "normal:text_align_h", "left");
    widget_set_style_str(left_label, "normal:text_align_v", "middle");
    widget_set_style_str(left_label, "normal:font_name", "NotoSansSC_Regular");
    widget_set_style_int(left_label, "normal:font_size", 32);
    widget_set_style_color(left_label, "normal:text_color", 0xffffffff);
    set_complex_label(left_label, screen_saver_setting->left_complex);

    widget_t* right_icon = image_create(overlay, 257, 308, 72, 72);
    image_set_draw_type(right_icon, IMAGE_DRAW_SCALE);
    set_complex_icon(right_icon, screen_saver_setting->right_complex);

    widget_t* right_label = label_create(overlay, 331, 316, 126, 56);
    widget_set_style_str(right_label, "normal:text_align_h", "left");
    widget_set_style_str(right_label, "normal:text_align_v", "middle");
    widget_set_style_str(right_label, "normal:font_name", "NotoSansSC_Regular");
    widget_set_style_int(right_label, "normal:font_size", 32);
    widget_set_style_color(right_label, "normal:text_color", 0xffffffff);
    set_complex_label(right_label, screen_saver_setting->right_complex);

    widget_t* line = view_create(overlay, 240, 320, 1, 48);
    widget_set_style_color(line, "normal:bg_color", 0xffffffff);

    widget_on(overlay, EVT_POINTER_MOVE, close_window_on_event, overlay);
    widget_on(overlay, EVT_POINTER_UP, close_window_on_event, overlay);
    widget_on(overlay, EVT_KEY_UP, close_window_on_event, overlay);

    return RET_OK;
}

static ret_t on_anim_end(void* ctx, event_t* e) {
  widget_t* win = WIDGET(ctx);
  window_manager_close_window_force(window_manager(), win);
  return RET_OK;
}

ret_t close_screen_saver_ainm_weather(bool_t disable_anim) {
    const char *name = "saver_real_time_weather";
    widget_t *win;
    widget_t *wm = window_manager();
    return_value_if_fail(name != NULL && *name != '\0', RET_BAD_PARAMS);

    win = widget_child(wm, name);
    return_value_if_fail(win != NULL, RET_FAIL);

    widget_destroy_animator(win, "open");

    if (disable_anim) {
        return window_manager_close_window_force(wm, win);
    } else {
        widget_create_animator(win, "opacity(name=close,duration=1500,easing=quadratic_inout,from=255,to=0)");
        widget_on(win, EVT_ANIM_END, on_anim_end, win);
    }

    return RET_OK;
}

简易时钟

/*
	screen_saver_simple_clock.c
*/
#include "awtk.h"
#include "../../common/navigator.h"
#include "../../common/ui_widget.h"
#include "../../common/ui_page_load.h"
#include "../../common/ui_cache_data.h"
#include "../../common/ui_font_icon.h"

#include "ui_colmo_knob_common.h"


static ret_t close_window_on_event(void* ctx, event_t* e) {
  window_close(WIDGET(ctx));
  /* 释放资源 */
  image_manager_unload_unused(image_manager(), 0);
  font_manager_shrink_cache(font_manager(), 0);
  return RET_REMOVE;
}

ret_t open_screen_saver_simple_clock(void* data, bool_t disable_anim) {
    char str[64];
    const char* name = "saver_simple_clock";

    ui_screen_saver_setting_t* saver_setting = (ui_screen_saver_setting_t*)data;

    widget_t* overlay = overlay_create(window_manager(), 0, 0, 480, 480);
    widget_set_name(overlay, name);
    widget_set_style_color(overlay, "normal:bg_color", 0xff000000);

    widget_t* logo = image_create(overlay, 155, 284, 171, 27);
    image_set_image(logo, "screen_saver/knob_pic_logo");

    widget_t* center_point = image_create(overlay, 232, 232, 16, 16);
    image_set_image(center_point, "screen_saver/knob_pic_point");

    widget_t* time_clock = time_clock_create(overlay, 0, 0, 480, 480);
    time_clock_set_hour_image(time_clock, "vg_knob_pic_hour");
    time_clock_set_minute_image(time_clock, "vg_knob_pic_min");
    time_clock_set_second_image(time_clock, "vg_knob_pic_second");
    
    tk_snprintf(str, sizeof(str), "screen_saver/%s", saver_setting->style_image);
    time_clock_set_bg_image(time_clock, str);

    time_clock_set_hour_anchor(time_clock, "0.5", "140px");
    time_clock_set_minute_anchor(time_clock, "0.5", "172px");
    time_clock_set_second_anchor(time_clock, "0.5", "172px");

    if (disable_anim == FALSE) {
        widget_create_animator(overlay, "opacity(name=open,duration=1500,easing=quadratic_inout,from=0,to=255)");
    }

    widget_on(overlay, EVT_POINTER_MOVE, close_window_on_event, overlay);
    widget_on(overlay, EVT_POINTER_UP, close_window_on_event, overlay);
    widget_on(overlay, EVT_KEY_UP, close_window_on_event, overlay);

    return RET_OK;
}

static ret_t on_anim_end(void* ctx, event_t* e) {
  widget_t* win = WIDGET(ctx);
  window_manager_close_window_force(window_manager(), win);
  return RET_OK;
}

ret_t close_screen_saver_simple_clock(bool_t disable_anim) {
    const char *name = "saver_simple_clock";
    widget_t *win;
    widget_t *wm = window_manager();
    return_value_if_fail(name != NULL && *name != '\0', RET_BAD_PARAMS);

    win = widget_child(wm, name);
    return_value_if_fail(win != NULL, RET_FAIL);

    widget_destroy_animator(win, "open");

    if (disable_anim) {
        return window_manager_close_window_force(wm, win);
    } else {
        widget_create_animator(win, "opacity(name=close,duration=1500,easing=quadratic_inout,from=255,to=0)");
        widget_on(win, EVT_ANIM_END, on_anim_end, win);
    }

    return RET_OK;
}

屏保

/*
	screen_saver.c
*/
#ifdef AWTK_NOT_RUN_IN_PC
#include <nuttx/config.h>
#endif
#include "awtk.h"
#include "../../common/navigator.h"
#include "../../common/ui_widget.h"
#include "../../common/ui_page_load.h"
#include "../../common/ui_cache_data.h"

#include "ui_colmo_knob_common.h"

extern ret_t open_screen_saver_simple_clock(void* data, bool_t disable_anim);
extern ret_t open_screen_saver_galaxy_clock(void* data, bool_t disable_anim);
extern ret_t open_screen_saver_real_time_weather(void* data, bool_t disable_anim);
extern ret_t open_screen_saver_galaxy_ainm(void* data, bool_t disable_anim);

#ifdef CONFIG_BES_HAVE_DVFS
extern sem_t lowpower_on_sem;
extern bool_t lowpower_state;
#endif

static ret_t open_screen_saver(const char* name, void* data) {
  if (tk_str_eq(name, "saver_simple_clock")) {
    return open_screen_saver_simple_clock(data, FALSE);
  } 
  else if (tk_str_eq(name, "saver_galaxy_clock")) {
    return open_screen_saver_galaxy_clock(data, FALSE);
  }
  else if (tk_str_eq(name, "saver_real_time_weather")) {
    return open_screen_saver_real_time_weather(data, FALSE);
  }
  else if (tk_str_eq(name, "saver_galaxy_ainm")) {
    return open_screen_saver_galaxy_ainm(data, FALSE);
  }

  return RET_FAIL;
}


ret_t on_screen_saver(void* ctx, event_t* e) {
  widget_t* win = NULL;
  // const char* screen_saver_win = "saver_simple_clock";
  // const char* screen_saver_win = "saver_galaxy_clock";
  // const char* screen_saver_win = "saver_real_time_weather";
  // const char* screen_saver_win = "saver_galaxy_ainm";

  const char* screen_saver_win = g_current_screen_saver;

  if (screen_saver_win == NULL || *screen_saver_win == '\0') {
    return RET_FAIL;
  }

  if (widget_child(window_manager(), screen_saver_win) != NULL) {
    log_debug("screen saver exist.\n");
#ifdef CONFIG_BES_HAVE_DVFS
    if(lowpower_state == false){
        sem_post(&lowpower_on_sem);
    }
#endif
    return RET_OK;
  }

  /* 释放资源 */
  image_manager_unload_unused(image_manager(), 0);
  font_manager_shrink_cache(font_manager(), 0);
  
  ui_screen_saver_setting_t* saver_setting = NULL;

  for (uint32_t i = 0; i < ARRAY_SIZE(g_ui_screen_saver_setting); i++) {
    if (tk_str_eq(g_ui_screen_saver_setting[i].name, screen_saver_win)) {
      saver_setting = &g_ui_screen_saver_setting[i];
      break;
    }
  }

  if (RET_FAIL == open_screen_saver(screen_saver_win, (void*)saver_setting)) {
    return RET_FAIL;
  }

#ifdef CONFIG_BES_HAVE_DVFS
  /* enable screen saver */
  window_manager_set_screen_saver_time(window_manager(), 10 * 1000);
#endif
  return RET_OK;
}

设置子页面

屏保主页面

效果预览

思路

  1. 创建 屏保 列表视图

      widget_t* list_view = list_view_create(win, 32, 120, 416, 360);
      widget_t* scroll_bar = scroll_bar_create_mobile(list_view, 0, 0, 0, 0);
      widget_t* scroll_view = scroll_view_create(list_view, 0, 0, 416, 360);
    
      ui_cache_data_t* ui_cache_data = setting_get_ui_cache_data();
    
      char str[64] = {0};
    
      if (ui_cache_data->screen_save_enter_time / 1000 / 60 > 0) {
        tk_snprintf(str, sizeof(str), "无操作%d分钟后", ui_cache_data->screen_save_enter_time / 1000 / 60);
      }
      else {
        tk_snprintf(str, sizeof(str), "无操作%d秒后", ui_cache_data->screen_save_enter_time / 1000);
      }
      
      setting_list_data.item_data[1].text2 = str;
    
    
      char str2[64] = {0};
      if (ui_cache_data->screen_enter_sleep_time / 1000 / 60 > 0) {
        tk_snprintf(str2, sizeof(str2), "%d分钟", ui_cache_data->screen_enter_sleep_time / 1000 / 60);
      }
      else {
        tk_snprintf(str2, sizeof(str2), "%d秒", ui_cache_data->screen_enter_sleep_time / 1000);
      }
      setting_list_data.item_data[2].text2 = str2;
    
      ui_load_setting_screen_save_list(scroll_view, (void*)&setting_list_data);
    
  2. 加载 屏保 数据列表,ui_load_setting_screen_save_list

    void ui_load_setting_screen_save_list(widget_t* list, void* data) {
        if (list == NULL || data == NULL) {
            return;
        }
    
        ui_component_data_t* list_data = (ui_component_data_t*)data;
        uint32_t size = list_data->size;
        ui_item_data_t* item_data = list_data->item_data;
    
        for (uint32_t i = 0; i < size; i++) {
            widget_t* list_item = list_item_create(list, 0, 0, 416, 96);
    
            widget_t* button = button_create(list_item, 0, 0, 416, 80);
            widget_set_style_color(button, "normal:bg_color", 0xff1f1f1f);
    #if !defined(AWTK_NOT_ROUND_RADIUS)
            widget_set_style_int(button, "normal:round_radius", 40);
    #endif
            widget_set_style_color(button, "pressed:bg_color", 0xff1f1f1f);
    #if !defined(AWTK_NOT_ROUND_RADIUS)
            widget_set_style_int(button, "pressed:round_radius", 40);
    #endif
            widget_set_style_color(button, "over:bg_color", 0xff1f1f1f);
    #if !defined(AWTK_NOT_ROUND_RADIUS)
            widget_set_style_int(button, "over:round_radius", 40);
    #endif
    
            widget_set_prop_str(button, "next_win", item_data[i].next_win);
    
            widget_t* icon = label_create(button, 364, 20, 40, 41);
            widget_set_style_str(icon, "normal:text_align_h", "center");
            widget_set_style_str(icon, "normal:text_align_v", "middle");
            widget_set_style_str(icon, "normal:font_name", "icomoon");
            widget_set_style_int(icon, "normal:font_size", 40);
            widget_set_style_color(icon, "normal:text_color", 0xffffffff);
            widget_set_text_utf8(icon, item_data[i].icon_name);
    
            widget_t* label = label_create(button, 24, 0, 160, 80);
            widget_set_style_str(label, "normal:text_align_h", "left");
            widget_set_style_str(label, "normal:text_align_v", "middle");
            widget_set_style_str(label, "normal:font_name", "NotoSansSC_Regular");
            widget_set_style_int(label, "normal:font_size", 28);
            widget_set_style_color(label, "normal:text_color", 0xffffffff);
            widget_set_text_utf8(label, item_data[i].text);
    
            if (item_data[i].text2 != NULL) {
            widget_t* label2 = label_create(button, 217, 22, 147, 36);
            widget_set_style_str(label2, "normal:text_align_h", "right");
            widget_set_style_str(label2, "normal:text_align_v", "middle");
            widget_set_style_str(label2, "normal:font_name", "NotoSansSC_Regular");
            widget_set_style_int(label2, "normal:font_size", 24);
            widget_set_style_color(label2, "normal:text_color", 0xB2ffffff);
            widget_set_text_utf8(label2, item_data[i].text2);
            }
    
    
            widget_on(button, EVT_CLICK, on_button, button);
        }
    }
    
  3. 组装 屏保 列表数据

    static ui_item_data_t setting_list_item_data[3] = {
      [0] = {
        .icon_name = ui_icon_arrow_right,
        .text = "我的屏保",
        .text2 = NULL,
        .next_win = "setting_my_screen_saver_page",
      },
      [1] = {
        .icon_name = ui_icon_arrow_right,
        .text = "自动进入屏保",
        .text2 = "无操作30秒后",
        .next_win = "setting_screen_save_enter_time_page",
      },
      [2] = {
        .icon_name = ui_icon_arrow_right,
        .text = "屏保显示时长",
        .text2 = "3分钟",
        .next_win = "setting_screen_enter_sleep_time_page",
      },
    };
    
    static ui_component_data_t setting_list_data = {
      .item_data = setting_list_item_data,
      .size = 3,
    };
    

实现

/*
	屏保主页面
	src/pages/setting/setting_screen_save_list_page.c
*/
#include "awtk.h"
#include "../../common/navigator.h"
#include "../../common/ui_widget.h"
#include "../../common/ui_page_load.h"
#include "../../common/ui_cache_data.h"
#include "../../common/ui_font_icon.h"

#include "scroll_view/list_view.h"
#include "scroll_view/scroll_bar.h"
#include "scroll_view/scroll_view.h"

#include "ui_colmo_knob_common.h"

#include "../../service/ui_setting_service.h"
#include "setting_common.h"

static ui_item_data_t setting_list_item_data[3] = {
  [0] = {
    .icon_name = ui_icon_arrow_right,
    .text = "我的屏保",
    .text2 = NULL,
    .next_win = "setting_my_screen_saver_page",
  },
  [1] = {
    .icon_name = ui_icon_arrow_right,
    .text = "自动进入屏保",
    .text2 = "无操作30秒后",
    .next_win = "setting_screen_save_enter_time_page",
  },
  [2] = {
    .icon_name = ui_icon_arrow_right,
    .text = "屏保显示时长",
    .text2 = "3分钟",
    .next_win = "setting_screen_enter_sleep_time_page",
  },
};

static ui_component_data_t setting_list_data = {
  .item_data = setting_list_item_data,
  .size = 3,
};

static ret_t on_back(void* ctx, event_t* e) {
  navigator_back();
  return RET_OK;
}

/* 初始化主页面 */
static ret_t init_setting_screen_save_list_page(widget_t* win) {
  widget_set_style_color(win, "normal:bg_color", 0xff000000);

  /* 窗体动画 */
  widget_set_prop_str(win, WIDGET_PROP_ANIM_HINT, "htranslate(duration=500,easing=cubic_out)");

  widget_t* back = button_create(win, 136, 54, 40, 40);
  widget_set_text_utf8(back, ui_icon_back_image_font);
  widget_set_style_str(back, "normal:font_name", "icomoon");
  widget_set_style_int(back, "normal:font_size", 40);
  widget_set_style_color(back, "normal:text_color", 0x66ffffff);
  widget_set_style_str(back, "over:font_name", "icomoon");
  widget_set_style_int(back, "over:font_size", 40);
  widget_set_style_color(back, "over:text_color", 0x66ffffff);
  widget_set_style_str(back, "pressed:font_name", "icomoon");
  widget_set_style_int(back, "pressed:font_size", 40);
  widget_set_style_color(back, "pressed:text_color", 0x66ffffff);
  widget_on(back, EVT_CLICK, on_back, win);

  widget_t* label = label_create(win, 176, 56, 128, 32);
  widget_set_style_str(label, "normal:text_align_h", "center");
  widget_set_style_str(label, "normal:text_align_v", "middle");
  widget_set_style_str(label, "normal:font_name", "NotoSansSC_Regular");
  widget_set_style_int(label, "normal:font_size", 32);
  widget_set_style_color(label, "normal:text_color", 0xffffffff);
  widget_set_text_utf8(label, "屏保设置");

  widget_t* list_view = list_view_create(win, 32, 120, 416, 360);
  widget_t* scroll_bar = scroll_bar_create_mobile(list_view, 0, 0, 0, 0);
  widget_t* scroll_view = scroll_view_create(list_view, 0, 0, 416, 360);

  ui_cache_data_t* ui_cache_data = setting_get_ui_cache_data();

  char str[64] = {0};

  if (ui_cache_data->screen_save_enter_time / 1000 / 60 > 0) {
    tk_snprintf(str, sizeof(str), "无操作%d分钟后", ui_cache_data->screen_save_enter_time / 1000 / 60);
  }
  else {
    tk_snprintf(str, sizeof(str), "无操作%d秒后", ui_cache_data->screen_save_enter_time / 1000);
  }
  
  setting_list_data.item_data[1].text2 = str;


  char str2[64] = {0};
  if (ui_cache_data->screen_enter_sleep_time / 1000 / 60 > 0) {
    tk_snprintf(str2, sizeof(str2), "%d分钟", ui_cache_data->screen_enter_sleep_time / 1000 / 60);
  }
  else {
    tk_snprintf(str2, sizeof(str2), "%d秒", ui_cache_data->screen_enter_sleep_time / 1000);
  }
  setting_list_data.item_data[2].text2 = str2;

  ui_load_setting_screen_save_list(scroll_view, (void*)&setting_list_data);

  return RET_OK;
}

/**
 * 初始化窗口的子控件
 */
static ret_t visit_init_child(void* ctx, const void* iter) {
  widget_t* win = WIDGET(ctx);
  widget_t* widget = WIDGET(iter);
  const char* name = widget->name;

  // 初始化指定名称的控件(设置属性或注册事件),请保证控件名称在窗口上唯一
  if (name != NULL && *name != '\0') {

  }

  return RET_OK;
}

/* 去初始化主页面 */
static ret_t deinit_setting_page(void* ctx, event_t* e) {
  return RET_OK;
}

static void setting_screen_save_list_page_event_regist(widget_t* win) {
  // widget_on(win, EVT_WINDOW_CLOSE, deinit_setting_page, win);
}

/**
 * 初始化窗口
 */
ret_t setting_screen_save_list_page_init(widget_t* win, void* ctx) {
  (void)ctx;
  return_value_if_fail(win != NULL, RET_BAD_PARAMS);

  init_setting_screen_save_list_page(win);

  /* 初始化每一个子控件 */
  // widget_foreach(win, visit_init_child, win);

  setting_screen_save_list_page_event_regist(win);

  return RET_OK;
}

屏保样式选择

效果预览

思路

  1. 页面主体

     /* 窗体动画 */
      widget_set_prop_str(win, WIDGET_PROP_ANIM_HINT, "htranslate(duration=500,easing=cubic_out)");
    
      widget_t* back = button_create(win, 144, 52, 192, 44);//返回按钮
      widget_t* label_icon = label_create(back, -8, 4, 40, 40);//创建字体图标
      ...// 设置控件样式
      widget_set_text_utf8(label_icon, ui_icon_back_image_font);
    
      widget_t* label_title = label_create(back, 32, 0, 128, 44);
      ...// 设置控件样式
      widget_set_text_utf8(label_title, "我的屏保");
    
      widget_on(back, EVT_CLICK, on_back, win);
    
      widget_t* button_edit = button_create(win, 140, 376, 200, 80);
      widget_set_text_utf8(button_edit, "编辑");
      ...// 设置控件样式
      widget_on(button_edit, EVT_CLICK, on_button_edit, slide_menu);
    
  2. 创建 样式选择 滑动页面

    widget_t* slide_menu = slide_menu_ex_create(win, -117, 120, 715, 240);//创建滑动菜单
      slide_menu_ex_set_align_v(slide_menu, ALIGN_V_MIDDLE);
      slide_menu_ex_set_min_scale(slide_menu, 0.83);
      slide_menu_ex_set_spacer(slide_menu, 32);
    
      char str[128];
      for (uint32_t i = 0; i < ARRAY_SIZE(g_ui_screen_saver_setting); i++) {
        widget_t* saver = image_create(slide_menu, 0, 0, 240, 240);
        widget_set_name(saver, g_ui_screen_saver_setting[i].name);
        image_set_draw_type(saver, IMAGE_DRAW_SCALE);
        tk_snprintf(str, sizeof(str), "screen_saver/%s", g_ui_screen_saver_setting[i].name);
        image_set_image(saver, str);
      }
    

实现

/*
	我的屏保二级页
	src/pages/setting/setting_my_screen_saver.c
*/
#include "awtk.h"
#include "../../common/navigator.h"
#include "../../common/ui_widget.h"
#include "../../common/ui_base_arc.h"
#include "../../common/ui_page_load.h"
#include "../../common/ui_cache_data.h"
#include "../../common/ui_font_icon.h"

#include "scroll_view/list_view.h"
#include "scroll_view/scroll_bar.h"
#include "scroll_view/scroll_view.h"

#include "ui_colmo_knob_common.h"


extern ret_t setting_screen_saver_page_init(widget_t* win, void* ctx);

static ret_t on_back(void* ctx, event_t* e) {
  return navigator_back();
}

static ret_t on_button_edit(void* ctx, event_t* e) {
  widget_t* slide_menu = WIDGET(ctx);

  uint32_t value = widget_get_prop_int(slide_menu, WIDGET_PROP_VALUE, 0);
  ui_screen_saver_setting_t* saver_setting = &g_ui_screen_saver_setting[value];
  g_current_screen_saver = saver_setting->name;

  widget_t *window = window_create(NULL, 0, 0, 0, 0);
  widget_set_name(window, NULL);

  setting_screen_saver_page_init(window, (void*)saver_setting);

  return RET_OK;
}

/* 初始化主页面 */
static ret_t init_setting_my_screen_saver_page(widget_t* win) {
  widget_set_style_color(win, "normal:bg_color", 0xff000000);

  /* 窗体动画 */
  widget_set_prop_str(win, WIDGET_PROP_ANIM_HINT, "htranslate(duration=500,easing=cubic_out)");

  widget_t* back = button_create(win, 144, 52, 192, 44);
  widget_t* label_icon = label_create(back, -8, 4, 40, 40);
  widget_set_style_str(label_icon, "normal:text_align_h", "center");
  widget_set_style_str(label_icon, "normal:text_align_v", "middle");
  widget_set_style_str(label_icon, "normal:font_name", "icomoon");
  widget_set_style_int(label_icon, "normal:font_size", 40);
  widget_set_style_color(label_icon, "normal:text_color", 0x66ffffff);
  widget_set_text_utf8(label_icon, ui_icon_back_image_font);

  widget_t* label_title = label_create(back, 32, 0, 128, 44);
  widget_set_style_str(label_title, "normal:text_align_h", "center");
  widget_set_style_str(label_title, "normal:text_align_v", "middle");
  widget_set_style_str(label_title, "normal:font_name", "NotoSansSC_Regular");
  widget_set_style_int(label_title, "normal:font_size", 32);
  widget_set_style_color(label_title, "normal:text_color", 0xffffffff);
  widget_set_text_utf8(label_title, "我的屏保");

  widget_on(back, EVT_CLICK, on_back, win);

  widget_t* slide_menu = slide_menu_ex_create(win, -117, 120, 715, 240);
  slide_menu_ex_set_align_v(slide_menu, ALIGN_V_MIDDLE);
  slide_menu_ex_set_min_scale(slide_menu, 0.83);
  slide_menu_ex_set_spacer(slide_menu, 32);

  char str[128];
  for (uint32_t i = 0; i < ARRAY_SIZE(g_ui_screen_saver_setting); i++) {
    widget_t* saver = image_create(slide_menu, 0, 0, 240, 240);
    widget_set_name(saver, g_ui_screen_saver_setting[i].name);
    image_set_draw_type(saver, IMAGE_DRAW_SCALE);
    tk_snprintf(str, sizeof(str), "screen_saver/%s", g_ui_screen_saver_setting[i].name);
    image_set_image(saver, str);
  }

  widget_t* button_edit = button_create(win, 140, 376, 200, 80);
  widget_set_text_utf8(button_edit, "编辑");
  widget_set_style_str(button_edit, "normal:font_name", "NotoSansSC_Regular");
  widget_set_style_int(button_edit, "normal:font_size", 28);
  widget_set_style_color(button_edit, "normal:text_color", 0xffffffff);
  widget_set_style_color(button_edit, "normal:bg_color", 0x1fffffff);
  widget_set_style_int(button_edit, "normal:round_radius", 40);

  widget_set_style_str(button_edit, "over:font_name", "NotoSansSC_Regular");
  widget_set_style_int(button_edit, "over:font_size", 28);
  widget_set_style_color(button_edit, "over:text_color", 0xffffffff);
  widget_set_style_color(button_edit, "over:bg_color", 0x1fffffff);
  widget_set_style_int(button_edit, "over:round_radius", 40);

  widget_set_style_str(button_edit, "pressed:font_name", "NotoSansSC_Regular");
  widget_set_style_int(button_edit, "pressed:font_size", 28);
  widget_set_style_color(button_edit, "pressed:text_color", 0xff466ae6);
  widget_set_style_color(button_edit, "pressed:bg_color", 0x1fffffff);
  widget_set_style_int(button_edit, "pressed:round_radius", 40);

  widget_on(button_edit, EVT_CLICK, on_button_edit, slide_menu);

  return RET_OK;
}

/**
 * 初始化窗口
 */
ret_t setting_my_screen_saver_page_init(widget_t* win, void* ctx) {
  (void)ctx;
  return_value_if_fail(win != NULL, RET_BAD_PARAMS);

  init_setting_my_screen_saver_page(win);

  return RET_OK;
}

屏保样式&复杂功能

效果预览

思路

  1. 样式种类

    ui_screen_saver_setting_t* saver_setting = (ui_screen_saver_setting_t*)ctx;
      /* 有样式 */
      if (saver_setting->has_style) {
        widget_t* view0 = view_create(pages, 120, 18, 328, 360);
        widget_t* slide_view = slide_view_create(view0, 0, 0, 240, 240);
        slide_view_set_vertical(slide_view, true);
    
        /* 加载样式 */
        if (tk_str_eq(saver_setting->name, "saver_simple_clock")) 
        { /* 简约时钟 */
          for (uint32_t i = 0; i < saver_setting->num_of_styles; i++) {
            tk_snprintf(str, sizeof(str), "screen_saver/saver_simple_clock%02d", i+1);
            widget_t* saver = image_create(slide_view, 0, 0, 240, 240);
            widget_set_name(saver, str);
            image_set_draw_type(saver, IMAGE_DRAW_SCALE);
            image_set_image(saver, str);
          }
    
          saver_setting->style_image = "clock_bg_03";
        }
        else if (tk_str_eq(saver_setting->name, "saver_galaxy_clock")) 
        { /* 星系表盘 */
          for (uint32_t i = 0; i < saver_setting->num_of_styles; i++) {
            tk_snprintf(str, sizeof(str), "screen_saver/saver_galaxy_clock%02d", i+1);
            widget_t* saver = image_create(slide_view, 0, 0, 240, 240);
            widget_set_name(saver, str);
            image_set_draw_type(saver, IMAGE_DRAW_SCALE);
            image_set_image(saver, str);
          }
    
          saver_setting->style_image = "clock_bg_03";
        }
        else if (tk_str_eq(saver_setting->name, "saver_galaxy_ainm")) 
        { /* 天文星系 */
          for (uint32_t i = 0; i < saver_setting->num_of_styles; i++) {
            tk_snprintf(str, sizeof(str), "screen_saver/saver_galaxy_ainm%02d", i+1);
            widget_t* saver = image_create(slide_view, 0, 0, 240, 240);
            widget_set_name(saver, str);
            image_set_draw_type(saver, IMAGE_DRAW_SCALE);
            image_set_image(saver, str);
          }
    
          saver_setting->style_image = "earth";
    
          widget_t* style_title = label_create(view0, 92, 256, 56, 40);
          widget_set_name(style_title, "style_title");
          ...//设置控件样式
          widget_set_text_utf8(style_title, "地球");
        }
    
        widget_on(slide_view, EVT_VALUE_CHANGED, on_style_changed, (void*)saver_setting);
    
        widget_t* slide_indicator = slide_indicator_create(view0, 320, 46, 8, 148);
        widget_set_style_color(slide_indicator, "normal:fg_color", 0x66ffffff);
        widget_set_style_color(slide_indicator, "normal:selected_fg_color", 0xffffffff);
    
        widget_t* tab_button0 = tab_button_create(tab_button_group, 0, 0, 0, 0);
        widget_set_text_utf8(tab_button0, "样式");
    	...//设置控件样式
    
        // widget_on(tab_button0, EVT_VALUE_CHANGED, on_tab_button0_value_changed, win);
      }
    
    
  2. 有复杂功能

    /* 有复杂功能 */
      if (saver_setting->has_complex) {
        widget_t* view1 = view_create(pages, 0, 0, 480, 378);
    
        widget_t* notice_label = label_create(view1, 114, 274, 252, 40);
        ...//设置控件样式
        widget_set_text_utf8(notice_label, "可替换表盘上的信息");
    
        widget_t* bg_image = image_create(view1, 120, 18, 240, 240);
        image_set_draw_type(bg_image, IMAGE_DRAW_SCALE);
        if (tk_str_eq(saver_setting->name, "saver_galaxy_ainm")) {
          image_set_image(bg_image, "screen_saver/saver_galaxy_ainm");
        }
        else if (tk_str_eq(saver_setting->name, "saver_real_time_weather")) {
          image_set_image(bg_image, "screen_saver/saver_real_time_weather");
        }
    
        widget_t* left_button = button_create(bg_image, 30, 154, 80, 36);
    	...//设置控件样式
    
        widget_on(left_button, EVT_CLICK, on_left_complex_button, (void*)saver_setting); /* 注册按钮事件 */
    
        widget_t* left_icon = image_create(left_button, 0, 0, 36, 36);
        widget_set_name(left_icon, "icon");
        image_set_draw_type(left_icon, IMAGE_DRAW_SCALE);
        set_complex_icon(left_icon, saver_setting->left_complex);
    
        widget_t* left_label = label_create(left_button, 40, 0, 40, 36);
        widget_set_name(left_label, "label");
        ...//设置控件样式
        set_complex_label(left_label, saver_setting->left_complex);
    
    
        widget_t* right_button = button_create(bg_image, 131, 154, 80, 36);
        ...//设置控件样式
    
        widget_on(right_button, EVT_CLICK, on_right_complex_button, (void*)saver_setting); /* 注册按钮事件 */
    
        widget_t* right_icon = image_create(right_button, 0, 0, 36, 36);
        widget_set_name(right_icon, "icon");
        image_set_draw_type(right_icon, IMAGE_DRAW_SCALE);
        set_complex_icon(right_icon, saver_setting->right_complex);
    
        widget_t* right_label = label_create(right_button, 40, 0, 40, 36);
        widget_set_name(right_label, "label");
        ...//设置控件样式
        set_complex_label(right_label, saver_setting->right_complex);
    
        widget_t* tab_button1 = tab_button_create(tab_button_group, 0, 0, 0, 0);
        widget_set_text_utf8(tab_button1, "复杂功能");
        ...//设置控件样式
    
        // widget_on(tab_button1, EVT_VALUE_CHANGED, on_tab_button1_value_changed, win);
      }
    

实现

/*
	我的屏保 二级页
	src/pages/setting/setting_screen_saver.c
*/
#include "awtk.h"
#include "../../common/navigator.h"
#include "../../common/ui_widget.h"
#include "../../common/ui_base_arc.h"
#include "../../common/ui_page_load.h"
#include "../../common/ui_cache_data.h"
#include "../../common/ui_font_icon.h"

#include "scroll_view/list_view.h"
#include "scroll_view/scroll_bar.h"
#include "scroll_view/scroll_view.h"

#include "ui_colmo_knob_common.h"

extern ret_t setting_screen_saver_complex_function_page(void* ctx, uint8_t button, widget_t* complex_button);

static ret_t on_back(void* ctx, event_t* e) {
  return navigator_back();
}

static ret_t on_tab_button0_value_changed(void* ctx, event_t* e) {
  widget_t* tab_button0 = WIDGET(e->target);
  log_info("on_tab_button0_value_changed %d\r\n", widget_get_prop_int(tab_button0, WIDGET_PROP_VALUE, 0));
  return RET_OK;
}

static ret_t on_tab_button1_value_changed(void* ctx, event_t* e) {
  widget_t* tab_button1 = WIDGET(e->target);
  log_info("on_tab_button1_value_changed %d\r\n", widget_get_prop_int(tab_button1, WIDGET_PROP_VALUE, 0));
  return RET_OK;
}

static ret_t on_style_changed(void* ctx, event_t* e) {
  widget_t* slide_view = WIDGET(e->target);
  ui_screen_saver_setting_t* saver_setting = (ui_screen_saver_setting_t*)ctx;
  
  uint32_t value = widget_get_prop_int(slide_view, WIDGET_PROP_VALUE, 0);

  if (tk_str_eq(saver_setting->name, "saver_simple_clock")) { /* 简约时钟 */
    switch (value) {
    case 0:
      saver_setting->style_image = "clock_bg_03";
      break;
    case 1:
      saver_setting->style_image = "clock_bg_01";
      break;
    case 2:
      saver_setting->style_image = "clock_bg_02";
      break;
    }
  }
  else if (tk_str_eq(saver_setting->name, "saver_galaxy_clock")) { /* 星系表盘 */
    switch (value) {
    case 0:
      saver_setting->style_image = "clock_bg_03";
      break;
    case 1:
      saver_setting->style_image = "clock_bg_01";
      break;
    case 2:
      saver_setting->style_image = "clock_bg_02";
      break;
    }
  }
  else if (tk_str_eq(saver_setting->name, "saver_galaxy_ainm")) { /* 天文星系 */
    widget_t* view0 = slide_view->parent;
    widget_t* style_title = widget_child(view0, "style_title");
    switch (value) {
    case 0:
      saver_setting->style_image = "earth";
      widget_set_text_utf8(style_title, "地球");
      break;
    case 1:
      saver_setting->style_image = "sun";
      widget_set_text_utf8(style_title, "太阳");
      break;
    case 2:
      saver_setting->style_image = "moon";
      widget_set_text_utf8(style_title, "月亮");
      break;
    }
  }

  return RET_OK;
}

static ret_t on_left_complex_button(void* ctx, event_t* e) {
  widget_t* left_complex_button = WIDGET(e->target);
  setting_screen_saver_complex_function_page(ctx, 0, left_complex_button);
  return RET_OK;
}

static ret_t on_right_complex_button(void* ctx, event_t* e) {
  widget_t* right_complex_button = WIDGET(e->target);
  setting_screen_saver_complex_function_page(ctx, 1, right_complex_button);
  return RET_OK;
}

static void set_complex_icon(widget_t* image, ui_complex_type_e complex_type) {
  switch (complex_type) {
  case ui_complex_display_date:
    image_set_image(image, "ic_date");
    break;
  case ui_complex_display_week:
    image_set_image(image, "ic_week");
    break;
  case ui_complex_display_weather:
    image_set_image(image, "ic_weather");
    break;
  case ui_complex_display_indoor_temp:
    image_set_image(image, "ic_indoor_temp");
    break;
  case ui_complex_display_indoor_humidity:
    image_set_image(image, "ic_indoor_humidity");
    break;
  case ui_complex_display_outdoor_temp:
    image_set_image(image, "ic_outdoor_temp");
    break;
  case ui_complex_not_display:
    image_set_image(image, "");
    break;
  default:
    break;
  }
}

static void set_complex_label(widget_t* label, ui_complex_type_e complex_type) {
  char str[32];
  switch (complex_type) {
  case ui_complex_display_date:
    tk_snprintf(str, sizeof(str), "%02d.%02d", g_current_env_info.dt.month, g_current_env_info.dt.day);
    widget_set_text_utf8(label, str);
    break;
  case ui_complex_display_week:
    if (g_current_env_info.dt.wday == 0) {
      widget_set_text_utf8(label, "周日");
    }
    else if (g_current_env_info.dt.wday == 1) {
      widget_set_text_utf8(label, "周一");
    }
    else if (g_current_env_info.dt.wday == 2) {
      widget_set_text_utf8(label, "周二");
    }
    else if (g_current_env_info.dt.wday == 3) {
      widget_set_text_utf8(label, "周三");
    }
    else if (g_current_env_info.dt.wday == 4) {
      widget_set_text_utf8(label, "周四");
    }
    else if (g_current_env_info.dt.wday == 5) {
      widget_set_text_utf8(label, "周五");
    }
    else if (g_current_env_info.dt.wday == 6) {
      widget_set_text_utf8(label, "周六");
    }
    break;
  case ui_complex_display_weather:
    if (g_current_env_info.weather == ui_weather_cloudy) {
      widget_set_text_utf8(label, "多云");
    }
    else if (g_current_env_info.weather == ui_weather_fog) {
      widget_set_text_utf8(label, "雾天");
    }
    else if (g_current_env_info.weather == ui_weather_rain_big) {
      widget_set_text_utf8(label, "大雨");
    }
    else if (g_current_env_info.weather == ui_weather_rain_small) {
      widget_set_text_utf8(label, "小雨");
    }
    else if (g_current_env_info.weather == ui_weather_snow) {
      widget_set_text_utf8(label, "雪天");
    }
    else if (g_current_env_info.weather == ui_weather_sunny) {
      widget_set_text_utf8(label, "晴天");
    }
    else if (g_current_env_info.weather == ui_weather_wind) {
      widget_set_text_utf8(label, "有风");
    }
    break;
  case ui_complex_display_indoor_temp:
    tk_snprintf(str, sizeof(str), "%d℃", g_current_env_info.indoor_temp);
    widget_set_text_utf8(label, str);
    break;
  case ui_complex_display_indoor_humidity:
    tk_snprintf(str, sizeof(str), "%d%%", g_current_env_info.indoor_humidity);
    widget_set_text_utf8(label, str);
    break;
  case ui_complex_display_outdoor_temp:
    tk_snprintf(str, sizeof(str), "%d℃", g_current_env_info.outdoor_temp);
    widget_set_text_utf8(label, str);
    break;
  case ui_complex_not_display:
    widget_set_text_utf8(label, "");
    break;
  default:
    break;
  }
}

/* 初始化主页面 */
static ret_t init_setting_screen_saver_page(widget_t* win, void* ctx) {
  char str[128];
  ui_screen_saver_setting_t* saver_setting = (ui_screen_saver_setting_t*)ctx;

  widget_set_style_color(win, "normal:bg_color", 0xff000000);
  widget_t* tab_control = tab_control_create(win, 0, 52, 480, 428);
  widget_t* pages = pages_create(tab_control, 0, 50, 480, 378);
  widget_t* tab_button_group = tab_button_group_create(tab_control, 120, 0, 240, 50);

  /* 有样式 */
  if (saver_setting->has_style) {
    widget_t* view0 = view_create(pages, 120, 18, 328, 360);
    widget_t* slide_view = slide_view_create(view0, 0, 0, 240, 240);
    slide_view_set_vertical(slide_view, true);

    /* 加载样式 */
    if (tk_str_eq(saver_setting->name, "saver_simple_clock")) 
    { /* 简约时钟 */
      for (uint32_t i = 0; i < saver_setting->num_of_styles; i++) {
        tk_snprintf(str, sizeof(str), "screen_saver/saver_simple_clock%02d", i+1);
        widget_t* saver = image_create(slide_view, 0, 0, 240, 240);
        widget_set_name(saver, str);
        image_set_draw_type(saver, IMAGE_DRAW_SCALE);
        image_set_image(saver, str);
      }

      saver_setting->style_image = "clock_bg_03";
    }
    else if (tk_str_eq(saver_setting->name, "saver_galaxy_clock")) 
    { /* 星系表盘 */
      for (uint32_t i = 0; i < saver_setting->num_of_styles; i++) {
        tk_snprintf(str, sizeof(str), "screen_saver/saver_galaxy_clock%02d", i+1);
        widget_t* saver = image_create(slide_view, 0, 0, 240, 240);
        widget_set_name(saver, str);
        image_set_draw_type(saver, IMAGE_DRAW_SCALE);
        image_set_image(saver, str);
      }

      saver_setting->style_image = "clock_bg_03";
    }
    else if (tk_str_eq(saver_setting->name, "saver_galaxy_ainm")) 
    { /* 天文星系 */
      for (uint32_t i = 0; i < saver_setting->num_of_styles; i++) {
        tk_snprintf(str, sizeof(str), "screen_saver/saver_galaxy_ainm%02d", i+1);
        widget_t* saver = image_create(slide_view, 0, 0, 240, 240);
        widget_set_name(saver, str);
        image_set_draw_type(saver, IMAGE_DRAW_SCALE);
        image_set_image(saver, str);
      }

      saver_setting->style_image = "earth";

      widget_t* style_title = label_create(view0, 92, 256, 56, 40);
      widget_set_name(style_title, "style_title");
      widget_set_style_str(style_title, "normal:text_align_h", "center");
      widget_set_style_str(style_title, "normal:text_align_v", "middle");
      widget_set_style_str(style_title, "normal:font_name", "NotoSansSC_Regular");
      widget_set_style_int(style_title, "normal:font_size", 28);
      widget_set_style_color(style_title, "normal:text_color", 0xffffffff);
      widget_set_text_utf8(style_title, "地球");
    }

    widget_on(slide_view, EVT_VALUE_CHANGED, on_style_changed, (void*)saver_setting);

    widget_t* slide_indicator = slide_indicator_create(view0, 320, 46, 8, 148);
    widget_set_style_color(slide_indicator, "normal:fg_color", 0x66ffffff);
    widget_set_style_color(slide_indicator, "normal:selected_fg_color", 0xffffffff);

    widget_t* tab_button0 = tab_button_create(tab_button_group, 0, 0, 0, 0);
    widget_set_text_utf8(tab_button0, "样式");
    widget_set_style_color(tab_button0, "normal:text_color",            0x66ffffff);
    widget_set_style_color(tab_button0, "pressed:text_color",           0x66ffffff);
    widget_set_style_color(tab_button0, "over:text_color",              0x66ffffff);
    widget_set_style_color(tab_button0, "disable:text_color",           0x66ffffff);
    widget_set_style_color(tab_button0, "focused:text_color",           0x66ffffff);
    widget_set_style_color(tab_button0, "normal_of_active:text_color",  0xffffffff);
    widget_set_style_color(tab_button0, "pressed_of_active:text_color", 0xffffffff);
    widget_set_style_color(tab_button0, "over_of_active:text_color",    0xffffffff);
    widget_set_style_color(tab_button0, "disable_of_active:text_color", 0xffffffff);
    widget_set_style_color(tab_button0, "focused_of_active:text_color", 0xffffffff);

    widget_set_style_color(tab_button0, "normal_of_active:border_color",  0xff466ae6);
    widget_set_style_color(tab_button0, "pressed_of_active:border_color", 0xff466ae6);
    widget_set_style_color(tab_button0, "over_of_active:border_color",    0xff466ae6);
    widget_set_style_color(tab_button0, "disable_of_active:border_color", 0xff466ae6);
    widget_set_style_color(tab_button0, "focused_of_active:border_color", 0xff466ae6);

    widget_set_style_int(tab_button0, "normal_of_active:border_width",  3);
    widget_set_style_int(tab_button0, "pressed_of_active:border_width", 3);
    widget_set_style_int(tab_button0, "over_of_active:border_width",    3);
    widget_set_style_int(tab_button0, "disable_of_active:border_width", 3);
    widget_set_style_int(tab_button0, "focused_of_active:border_width", 3);

    widget_set_style_int(tab_button0, "normal_of_active:border",  BORDER_BOTTOM);
    widget_set_style_int(tab_button0, "pressed_of_active:border", BORDER_BOTTOM);
    widget_set_style_int(tab_button0, "over_of_active:border",    BORDER_BOTTOM);
    widget_set_style_int(tab_button0, "disable_of_active:border", BORDER_BOTTOM);
    widget_set_style_int(tab_button0, "focused_of_active:border", BORDER_BOTTOM);

    widget_set_style_int(tab_button0, "normal:font_size",            32);
    widget_set_style_int(tab_button0, "pressed:font_size",           32);
    widget_set_style_int(tab_button0, "over:font_size",              32);
    widget_set_style_int(tab_button0, "disable:font_size",           32);
    widget_set_style_int(tab_button0, "focused:font_size",           32);
    widget_set_style_int(tab_button0, "normal_of_active:font_size",  32);
    widget_set_style_int(tab_button0, "pressed_of_active:font_size", 32);
    widget_set_style_int(tab_button0, "over_of_active:font_size",    32);
    widget_set_style_int(tab_button0, "disable_of_active:font_size", 32);
    widget_set_style_int(tab_button0, "focused_of_active:font_size", 32);

    // widget_on(tab_button0, EVT_VALUE_CHANGED, on_tab_button0_value_changed, win);
  }

  /* 有复杂功能 */
  if (saver_setting->has_complex) {
    widget_t* view1 = view_create(pages, 0, 0, 480, 378);

    widget_t* notice_label = label_create(view1, 114, 274, 252, 40);
    widget_set_style_str(notice_label, "normal:text_align_h", "center");
    widget_set_style_str(notice_label, "normal:text_align_v", "middle");
    widget_set_style_str(notice_label, "normal:font_name", "NotoSansSC_Regular");
    widget_set_style_int(notice_label, "normal:font_size", 28);
    widget_set_style_color(notice_label, "normal:text_color", 0xffffffff);
    widget_set_text_utf8(notice_label, "可替换表盘上的信息");

    widget_t* bg_image = image_create(view1, 120, 18, 240, 240);
    image_set_draw_type(bg_image, IMAGE_DRAW_SCALE);
    if (tk_str_eq(saver_setting->name, "saver_galaxy_ainm")) {
      image_set_image(bg_image, "screen_saver/saver_galaxy_ainm");
    }
    else if (tk_str_eq(saver_setting->name, "saver_real_time_weather")) {
      image_set_image(bg_image, "screen_saver/saver_real_time_weather");
    }

    widget_t* left_button = button_create(bg_image, 30, 154, 80, 36);
    widget_set_style_color(left_button, "normal:border_color",  0xffffffff);
    widget_set_style_int(left_button, "normal:border_width",  1);
    widget_set_style_int(left_button, "normal:border",  BORDER_ALL);
    widget_set_style_color(left_button, "pressed:border_color",  0xffffffff);
    widget_set_style_int(left_button, "pressed:border_width",  1);
    widget_set_style_int(left_button, "pressed:border",  BORDER_ALL);
    widget_set_style_color(left_button, "over:border_color",  0xffffffff);
    widget_set_style_int(left_button, "over:border_width",  1);
    widget_set_style_int(left_button, "over:border",  BORDER_ALL);

    widget_on(left_button, EVT_CLICK, on_left_complex_button, (void*)saver_setting); /* 注册按钮事件 */

    widget_t* left_icon = image_create(left_button, 0, 0, 36, 36);
    widget_set_name(left_icon, "icon");
    image_set_draw_type(left_icon, IMAGE_DRAW_SCALE);
    set_complex_icon(left_icon, saver_setting->left_complex);

    widget_t* left_label = label_create(left_button, 40, 0, 40, 36);
    widget_set_name(left_label, "label");
    widget_set_style_str(left_label, "normal:text_align_h", "left");
    widget_set_style_str(left_label, "normal:text_align_v", "middle");
    widget_set_style_str(left_label, "normal:font_name", "NotoSansSC_Regular");
    widget_set_style_int(left_label, "normal:font_size", 24);
    widget_set_style_color(left_label, "normal:text_color", 0xffffffff);
    set_complex_label(left_label, saver_setting->left_complex);


    widget_t* right_button = button_create(bg_image, 131, 154, 80, 36);
    widget_set_style_color(right_button, "normal:border_color",  0xffffffff);
    widget_set_style_int(right_button, "normal:border_width",  1);
    widget_set_style_int(right_button, "normal:border",  BORDER_ALL);
    widget_set_style_color(right_button, "pressed:border_color",  0xffffffff);
    widget_set_style_int(right_button, "pressed:border_width",  1);
    widget_set_style_int(right_button, "pressed:border",  BORDER_ALL);
    widget_set_style_color(right_button, "over:border_color",  0xffffffff);
    widget_set_style_int(right_button, "over:border_width",  1);
    widget_set_style_int(right_button, "over:border",  BORDER_ALL);

    widget_on(right_button, EVT_CLICK, on_right_complex_button, (void*)saver_setting); /* 注册按钮事件 */

    widget_t* right_icon = image_create(right_button, 0, 0, 36, 36);
    widget_set_name(right_icon, "icon");
    image_set_draw_type(right_icon, IMAGE_DRAW_SCALE);
    set_complex_icon(right_icon, saver_setting->right_complex);

    widget_t* right_label = label_create(right_button, 40, 0, 40, 36);
    widget_set_name(right_label, "label");
    widget_set_style_str(right_label, "normal:text_align_h", "left");
    widget_set_style_str(right_label, "normal:text_align_v", "middle");
    widget_set_style_str(right_label, "normal:font_name", "NotoSansSC_Regular");
    widget_set_style_int(right_label, "normal:font_size", 24);
    widget_set_style_color(right_label, "normal:text_color", 0xffffffff);
    set_complex_label(right_label, saver_setting->right_complex);

    widget_t* tab_button1 = tab_button_create(tab_button_group, 0, 0, 0, 0);
    widget_set_text_utf8(tab_button1, "复杂功能");
    widget_set_style_color(tab_button1, "normal:text_color", 0x66ffffff);
    widget_set_style_color(tab_button1, "pressed:text_color", 0x66ffffff);
    widget_set_style_color(tab_button1, "over:text_color", 0x66ffffff);
    widget_set_style_color(tab_button1, "disable:text_color", 0x66ffffff);
    widget_set_style_color(tab_button1, "focused:text_color", 0x66ffffff);
    widget_set_style_color(tab_button1, "normal_of_active:text_color", 0xffffffff);
    widget_set_style_color(tab_button1, "pressed_of_active:text_color", 0xffffffff);
    widget_set_style_color(tab_button1, "over_of_active:text_color", 0xffffffff);
    widget_set_style_color(tab_button1, "disable_of_active:text_color", 0xffffffff);
    widget_set_style_color(tab_button1, "focused_of_active:text_color", 0xffffffff);

    widget_set_style_color(tab_button1, "normal_of_active:border_color",  0xff466ae6);
    widget_set_style_color(tab_button1, "pressed_of_active:border_color", 0xff466ae6);
    widget_set_style_color(tab_button1, "over_of_active:border_color",    0xff466ae6);
    widget_set_style_color(tab_button1, "disable_of_active:border_color", 0xff466ae6);
    widget_set_style_color(tab_button1, "focused_of_active:border_color", 0xff466ae6);

    widget_set_style_int(tab_button1, "normal_of_active:border_width",  3);
    widget_set_style_int(tab_button1, "pressed_of_active:border_width", 3);
    widget_set_style_int(tab_button1, "over_of_active:border_width",    3);
    widget_set_style_int(tab_button1, "disable_of_active:border_width", 3);
    widget_set_style_int(tab_button1, "focused_of_active:border_width", 3);

    widget_set_style_int(tab_button1, "normal_of_active:border",  BORDER_BOTTOM);
    widget_set_style_int(tab_button1, "pressed_of_active:border", BORDER_BOTTOM);
    widget_set_style_int(tab_button1, "over_of_active:border",    BORDER_BOTTOM);
    widget_set_style_int(tab_button1, "disable_of_active:border", BORDER_BOTTOM);
    widget_set_style_int(tab_button1, "focused_of_active:border", BORDER_BOTTOM);

    widget_set_style_int(tab_button1, "normal:font_size",            32);
    widget_set_style_int(tab_button1, "pressed:font_size",           32);
    widget_set_style_int(tab_button1, "over:font_size",              32);
    widget_set_style_int(tab_button1, "disable:font_size",           32);
    widget_set_style_int(tab_button1, "focused:font_size",           32);
    widget_set_style_int(tab_button1, "normal_of_active:font_size",  32);
    widget_set_style_int(tab_button1, "pressed_of_active:font_size", 32);
    widget_set_style_int(tab_button1, "over_of_active:font_size",    32);
    widget_set_style_int(tab_button1, "disable_of_active:font_size", 32);
    widget_set_style_int(tab_button1, "focused_of_active:font_size", 32);

    // widget_on(tab_button1, EVT_VALUE_CHANGED, on_tab_button1_value_changed, win);
  }

  widget_t* back = button_create(win, 106, 54, 40, 40);
  widget_t* label_icon = label_create(back, 0, 0, 40, 40);
  widget_set_style_str(label_icon, "normal:text_align_h", "center");
  widget_set_style_str(label_icon, "normal:text_align_v", "middle");
  widget_set_style_str(label_icon, "normal:font_name", "icomoon");
  widget_set_style_int(label_icon, "normal:font_size", 40);
  widget_set_style_color(label_icon, "normal:text_color", 0x66ffffff);
  widget_set_text_utf8(label_icon, ui_icon_back_image_font);
  widget_on(back, EVT_CLICK, on_back, win);

  return RET_OK;
}

/**
 * 初始化窗口
 */
ret_t setting_screen_saver_page_init(widget_t* win, void* ctx) {
  return_value_if_fail(win != NULL, RET_BAD_PARAMS);
  init_setting_screen_saver_page(win, ctx);
  return RET_OK;
}

复杂功能

效果预览

思路

  1. 字体图标

    static void set_complex_icon(widget_t* image, ui_complex_type_e complex_type) {
      switch (complex_type) {
      case ui_complex_display_date:
        image_set_image(image, "ic_date");
        break;
      case ui_complex_display_week:
        image_set_image(image, "ic_week");
        break;
      case ui_complex_display_weather:
        image_set_image(image, "ic_weather");
        break;
      case ui_complex_display_indoor_temp:
        image_set_image(image, "ic_indoor_temp");
        break;
      case ui_complex_display_indoor_humidity:
        image_set_image(image, "ic_indoor_humidity");
        break;
      case ui_complex_display_outdoor_temp:
        image_set_image(image, "ic_outdoor_temp");
        break;
      case ui_complex_not_display:
        image_set_image(image, "");
        break;
      default:
        break;
      }
    }
    
  2. 字体文本

    static void set_complex_label(widget_t* label, ui_complex_type_e complex_type) {
      char str[32];
      switch (complex_type) {
      case ui_complex_display_date:
        tk_snprintf(str, sizeof(str), "%02d.%02d", g_current_env_info.dt.month, g_current_env_info.dt.day);
        widget_set_text_utf8(label, str);
        break;
      case ui_complex_display_week:
        if (g_current_env_info.dt.wday == 0) {
          widget_set_text_utf8(label, "周日");
        }
        else if (g_current_env_info.dt.wday == 1) {
          widget_set_text_utf8(label, "周一");
        }
        else if (g_current_env_info.dt.wday == 2) {
          widget_set_text_utf8(label, "周二");
        }
        else if (g_current_env_info.dt.wday == 3) {
          widget_set_text_utf8(label, "周三");
        }
        else if (g_current_env_info.dt.wday == 4) {
          widget_set_text_utf8(label, "周四");
        }
        else if (g_current_env_info.dt.wday == 5) {
          widget_set_text_utf8(label, "周五");
        }
        else if (g_current_env_info.dt.wday == 6) {
          widget_set_text_utf8(label, "周六");
        }
        break;
      case ui_complex_display_weather:
        if (g_current_env_info.weather == ui_weather_cloudy) {
          widget_set_text_utf8(label, "多云");
        }
        else if (g_current_env_info.weather == ui_weather_fog) {
          widget_set_text_utf8(label, "雾天");
        }
        else if (g_current_env_info.weather == ui_weather_rain_big) {
          widget_set_text_utf8(label, "大雨");
        }
        else if (g_current_env_info.weather == ui_weather_rain_small) {
          widget_set_text_utf8(label, "小雨");
        }
        else if (g_current_env_info.weather == ui_weather_snow) {
          widget_set_text_utf8(label, "雪天");
        }
        else if (g_current_env_info.weather == ui_weather_sunny) {
          widget_set_text_utf8(label, "晴天");
        }
        else if (g_current_env_info.weather == ui_weather_wind) {
          widget_set_text_utf8(label, "有风");
        }
        break;
      case ui_complex_display_indoor_temp:
        tk_snprintf(str, sizeof(str), "%d℃", g_current_env_info.indoor_temp);
        widget_set_text_utf8(label, str);
        break;
      case ui_complex_display_indoor_humidity:
        tk_snprintf(str, sizeof(str), "%d%%", g_current_env_info.indoor_humidity);
        widget_set_text_utf8(label, str);
        break;
      case ui_complex_display_outdoor_temp:
        tk_snprintf(str, sizeof(str), "%d℃", g_current_env_info.outdoor_temp);
        widget_set_text_utf8(label, str);
        break;
      case ui_complex_not_display:
        widget_set_text_utf8(label, "");
        break;
      default:
        break;
      }
    }
    

实现

/*
	复杂功能
	src/pages/setting/setting_screen_saver_complex_function.c
*/
#include "awtk.h"
#include "../../common/navigator.h"
#include "../../common/ui_widget.h"
#include "../../common/ui_base_arc.h"
#include "../../common/ui_page_load.h"
#include "../../common/ui_cache_data.h"
#include "../../common/ui_font_icon.h"

#include "scroll_view/list_view.h"
#include "scroll_view/scroll_bar.h"
#include "scroll_view/scroll_view.h"

#include "ui_colmo_knob_common.h"

static ui_item_data_t setting_list_date_data[2] = {
  [0] = {
    .icon_name = "ic_date",
    .text2 = "日期",
  },
  [1] = {
    .icon_name = "ic_week",
    .text2 = "今日周期"
  }
};

/* 日历 */
static ui_component_data_t setting_date_list = {
  .item_data = setting_list_date_data,
  .size = 2,
};


static ui_item_data_t setting_list_env_data[4] = {
  [0] = {
    .icon_name = "ic_indoor_temp",
    .text2 = "室内温度",
  },
  [1] = {
    .icon_name = "ic_indoor_humidity",
    .text2 = "室内湿度",
  },
  [2] = {
    .icon_name = "ic_weather",
    .text2 = "天气状况",
  },
  [3] = {
    .icon_name = "ic_outdoor_temp",
    .text2 = "室外温度",
  },
};

/* 环境信息 */
static ui_component_data_t setting_env_list = {
  .item_data = setting_list_env_data,
  .size = 4,
};

static void set_complex_icon(widget_t* image, ui_complex_type_e complex_type) {
  switch (complex_type) {
  case ui_complex_display_date:
    image_set_image(image, "ic_date");
    break;
  case ui_complex_display_week:
    image_set_image(image, "ic_week");
    break;
  case ui_complex_display_weather:
    image_set_image(image, "ic_weather");
    break;
  case ui_complex_display_indoor_temp:
    image_set_image(image, "ic_indoor_temp");
    break;
  case ui_complex_display_indoor_humidity:
    image_set_image(image, "ic_indoor_humidity");
    break;
  case ui_complex_display_outdoor_temp:
    image_set_image(image, "ic_outdoor_temp");
    break;
  case ui_complex_not_display:
    image_set_image(image, "");
    break;
  default:
    break;
  }
}

static void set_complex_label(widget_t* label, ui_complex_type_e complex_type) {
  char str[32];
  switch (complex_type) {
  case ui_complex_display_date:
    tk_snprintf(str, sizeof(str), "%02d.%02d", g_current_env_info.dt.month, g_current_env_info.dt.day);
    widget_set_text_utf8(label, str);
    break;
  case ui_complex_display_week:
    if (g_current_env_info.dt.wday == 0) {
      widget_set_text_utf8(label, "周日");
    }
    else if (g_current_env_info.dt.wday == 1) {
      widget_set_text_utf8(label, "周一");
    }
    else if (g_current_env_info.dt.wday == 2) {
      widget_set_text_utf8(label, "周二");
    }
    else if (g_current_env_info.dt.wday == 3) {
      widget_set_text_utf8(label, "周三");
    }
    else if (g_current_env_info.dt.wday == 4) {
      widget_set_text_utf8(label, "周四");
    }
    else if (g_current_env_info.dt.wday == 5) {
      widget_set_text_utf8(label, "周五");
    }
    else if (g_current_env_info.dt.wday == 6) {
      widget_set_text_utf8(label, "周六");
    }
    break;
  case ui_complex_display_weather:
    if (g_current_env_info.weather == ui_weather_cloudy) {
      widget_set_text_utf8(label, "多云");
    }
    else if (g_current_env_info.weather == ui_weather_fog) {
      widget_set_text_utf8(label, "雾天");
    }
    else if (g_current_env_info.weather == ui_weather_rain_big) {
      widget_set_text_utf8(label, "大雨");
    }
    else if (g_current_env_info.weather == ui_weather_rain_small) {
      widget_set_text_utf8(label, "小雨");
    }
    else if (g_current_env_info.weather == ui_weather_snow) {
      widget_set_text_utf8(label, "雪天");
    }
    else if (g_current_env_info.weather == ui_weather_sunny) {
      widget_set_text_utf8(label, "晴天");
    }
    else if (g_current_env_info.weather == ui_weather_wind) {
      widget_set_text_utf8(label, "有风");
    }
    break;
  case ui_complex_display_indoor_temp:
    tk_snprintf(str, sizeof(str), "%d℃", g_current_env_info.indoor_temp);
    widget_set_text_utf8(label, str);
    break;
  case ui_complex_display_indoor_humidity:
    tk_snprintf(str, sizeof(str), "%d%%", g_current_env_info.indoor_humidity);
    widget_set_text_utf8(label, str);
    break;
  case ui_complex_display_outdoor_temp:
    tk_snprintf(str, sizeof(str), "%d℃", g_current_env_info.outdoor_temp);
    widget_set_text_utf8(label, str);
    break;
  case ui_complex_not_display:
    widget_set_text_utf8(label, "");
    break;
  default:
    break;
  }
}

static ret_t on_select_button(void* ctx, event_t* e) {
  widget_t* button = WIDGET(e->target);
  widget_t* complex_button = WIDGET(ctx);
  widget_t* icon = widget_child(complex_button, "icon");
  widget_t* label = widget_child(complex_button, "label");
  
  uint32_t complex_type = widget_get_prop_int(button, "select_complex", ui_complex_undefine);
  uint32_t which_button = widget_get_prop_int(complex_button, "which_button", 0);

  for (uint32_t i = 0; i < ARRAY_SIZE(g_ui_screen_saver_setting); i++) {
    if (tk_str_eq(g_current_screen_saver, g_ui_screen_saver_setting[i].name)) {
      if (which_button == 0) { /* left */
        g_ui_screen_saver_setting[i].left_complex = complex_type;
      }
      else if (which_button == 1) { /* right */
        g_ui_screen_saver_setting[i].right_complex = complex_type;
      }
    }
  }

  set_complex_icon(icon, complex_type);
  set_complex_label(label, complex_type);

  navigator_back();
  return RET_OK;
}

static ret_t on_back(void* ctx, event_t* e) {
  navigator_back();
  return RET_OK;
}

static void set_button_style(widget_t* button) {
  widget_set_style_color(button, "normal:bg_color", 0xff1f1f1f);
  widget_set_style_int(button, "normal:round_radius", 40);
  widget_set_style_color(button, "pressed:bg_color", 0xff1f1f1f);
  widget_set_style_int(button, "pressed:round_radius", 40);
  widget_set_style_color(button, "over:bg_color", 0xff1f1f1f);
  widget_set_style_int(button, "over:round_radius", 40);
}

static void set_icon_style(widget_t* icon) {
  widget_set_style_str(icon, "normal:text_align_h", "center");
  widget_set_style_str(icon, "normal:text_align_v", "middle");
  widget_set_style_str(icon, "normal:font_name", "icomoon");
  widget_set_style_int(icon, "normal:font_size", 64);
  widget_set_style_color(icon, "normal:text_color", 0xffffffff);
  image_set_draw_type(icon, IMAGE_DRAW_SCALE);
}

static void set_label0_style(widget_t* label) {
  widget_set_style_str(label, "normal:text_align_h", "left");
  widget_set_style_str(label, "normal:text_align_v", "middle");
  widget_set_style_str(label, "normal:font_name", "NotoSansSC_Regular");
  widget_set_style_int(label, "normal:font_size", 40);
  widget_set_style_color(label, "normal:text_color", 0xffffffff);
}

static void set_label1_style(widget_t* label) {
  widget_set_style_str(label, "normal:text_align_h", "right");
  widget_set_style_str(label, "normal:text_align_v", "middle");
  widget_set_style_str(label, "normal:font_name", "NotoSansSC_Regular");
  widget_set_style_int(label, "normal:font_size", 24);
  widget_set_style_color(label, "normal:text_color", 0xb2ffffff);
}

/* 初始化主页面 */
static ret_t init_setting_screen_saver_complex_function_page(widget_t* win, void* ctx, widget_t* complex_button) {
  widget_set_style_color(win, "normal:bg_color", 0xff000000);

  widget_t* back = button_create(win, 136, 54, 40, 40);
  widget_set_text_utf8(back, ui_icon_back_image_font);
  widget_set_style_str(back, "normal:font_name", "icomoon");
  widget_set_style_int(back, "normal:font_size", 40);
  widget_set_style_color(back, "normal:text_color", 0x66ffffff);
  widget_set_style_str(back, "over:font_name", "icomoon");
  widget_set_style_int(back, "over:font_size", 40);
  widget_set_style_color(back, "over:text_color", 0x66ffffff);
  widget_set_style_str(back, "pressed:font_name", "icomoon");
  widget_set_style_int(back, "pressed:font_size", 40);
  widget_set_style_color(back, "pressed:text_color", 0x66ffffff);
  widget_on(back, EVT_CLICK, on_back, win);

  widget_t* title = label_create(win, 176, 56, 128, 32);
  widget_set_style_str(title, "normal:text_align_h", "center");
  widget_set_style_str(title, "normal:text_align_v", "middle");
  widget_set_style_str(title, "normal:font_name", "NotoSansSC_Regular");
  widget_set_style_int(title, "normal:font_size", 32);
  widget_set_style_color(title, "normal:text_color", 0xffffffff);
  widget_set_text_utf8(title, "选择功能");

  widget_t* list_view = list_view_create(win, 0, 96, 480, 384);
  widget_t* scroll_bar = scroll_bar_create_mobile(list_view, 0, 0, 0, 0);
  widget_t* scroll_view = scroll_view_create(list_view, 0, 0, 480, 376);

  widget_t* list_item_date = list_item_create(scroll_view, 0, 0, 480, 248);
  widget_t* title_date = label_create(list_item_date, 56, 24, 56, 40);
  widget_set_style_str(title_date, "normal:text_align_h", "left");
  widget_set_style_str(title_date, "normal:text_align_v", "middle");
  widget_set_style_str(title_date, "normal:font_name", "NotoSansSC_Regular");
  widget_set_style_int(title_date, "normal:font_size", 28);
  widget_set_style_color(title_date, "normal:text_color", 0xffffffff);
  widget_set_text_utf8(title_date, "日历");

  int32_t y = 72;
  for (uint32_t i = 0; i < setting_date_list.size; i++) {
    widget_t* button = button_create(list_item_date, 32, y, 416, 80);
    set_button_style(button);
    widget_t* icon = image_create(button, 24, 4, 72, 72);
    set_icon_style(icon);
    image_set_image(icon, setting_list_date_data[i].icon_name);
    widget_t* label0 = label_create(button, 98, 12, 126, 56);
    set_label0_style(label0);
    set_complex_label(label0, ui_complex_display_date + i);
    widget_t* label1 = label_create(button, 296, 22, 96, 36);
    set_label1_style(label1);
    widget_set_text_utf8(label1, setting_list_date_data[i].text2);

    widget_set_prop_int(button, "select_complex", ui_complex_display_date + i);
    widget_on(button, EVT_CLICK, on_select_button, complex_button);

    y += 96;
  }

  widget_t* list_item_env = list_item_create(scroll_view, 0, 248, 480, 536);
  widget_t* title_env = label_create(list_item_env, 56, 24, 112, 40);
  widget_set_style_str(title_env, "normal:text_align_h", "left");
  widget_set_style_str(title_env, "normal:text_align_v", "middle");
  widget_set_style_str(title_env, "normal:font_name", "NotoSansSC_Regular");
  widget_set_style_int(title_env, "normal:font_size", 28);
  widget_set_style_color(title_env, "normal:text_color", 0xffffffff);
  widget_set_text_utf8(title_env, "环境信息");

  y = 72;
  for (uint32_t i = 0; i < setting_env_list.size; i++) {
    widget_t* button = button_create(list_item_env, 32, y, 416, 80);
    set_button_style(button);
    widget_t* icon = image_create(button, 24, 4, 72, 72);
    set_icon_style(icon);
    image_set_image(icon, setting_list_env_data[i].icon_name);
    widget_t* label0 = label_create(button, 98, 12, 126, 56);
    set_label0_style(label0);
    set_complex_label(label0, ui_complex_display_date + i);
    widget_t* label1 = label_create(button, 296, 22, 96, 36);
    set_label1_style(label1);
    widget_set_text_utf8(label1, setting_list_env_data[i].text2);

    widget_set_prop_int(button, "select_complex", ui_complex_display_date + i);
    widget_on(button, EVT_CLICK, on_select_button, complex_button);

    y += 96;
  }

  widget_t* button = button_create(list_item_env, 32, y, 416, 80);
  set_button_style(button);
  widget_t* label = label_create(button, 0, 0, 416, 80);
  widget_set_style_str(label, "normal:text_align_h", "center");
  widget_set_style_str(label, "normal:text_align_v", "middle");
  widget_set_style_str(label, "normal:font_name", "NotoSansSC_Regular");
  widget_set_style_int(label, "normal:font_size", 28);
  widget_set_style_color(label, "normal:text_color", 0xb2ffffff);
  widget_set_text_utf8(label, "不展示");

  widget_set_prop_int(button, "select_complex", ui_complex_not_display);
  widget_on(button, EVT_CLICK, on_select_button, complex_button);

  return RET_OK;
}

/**
 * 初始化窗口
 * button 0 表示left,1表示right
 */
ret_t setting_screen_saver_complex_function_page(void* ctx, uint8_t button, widget_t* complex_button) {
  widget_t *window = window_create(NULL, 0, 0, 0, 0);
  widget_set_name(window, "setting_screen_saver_complex_function_page");
  return_value_if_fail(window != NULL, RET_BAD_PARAMS);
  widget_set_prop_int(complex_button, "which_button", button);
  init_setting_screen_saver_complex_function_page(window, ctx, complex_button);
  return RET_OK;
}

屏保显示时长

效果预览

思路

实现

/*
	屏保显示时长
	src/pages/setting/setting_screen_enter_sleep.c
*/
#include "awtk.h"
#include "../../common/navigator.h"
#include "../../common/ui_widget.h"
#include "../../common/ui_page_load.h"
#include "../../common/ui_cache_data.h"
#include "../../common/ui_font_icon.h"

#include "../../service/ui_setting_service.h"

#include "scroll_view/list_view.h"
#include "scroll_view/scroll_bar.h"
#include "scroll_view/scroll_view.h"

#include "ui_colmo_knob_common.h"


static ui_item_data_t view_item_data[3] = {
  [0] = {
    .value = 2 * 60 * 1000,
    .text = "2分钟",
  },
  [1] = {
    .value = 5 * 60 * 1000,
    .text = "5分钟",
  },
  [2] = {
    .value = 10 * 60 * 1000,
    .text = "10分钟",
  },
};

static ret_t on_button(void* ctx, event_t* e) {
  return navigator_back();
}

static ret_t on_back(void* ctx, event_t* e) {
  return navigator_back();
}

static ret_t on_radio(void* ctx, event_t* e) {
  widget_t* radio = WIDGET(ctx);
  uint32_t duration = widget_get_prop_int(radio, "duration", 0);
  bool_t value = widget_get_prop_bool(radio, WIDGET_PROP_VALUE, 0);
  if (value) {
    ui_set_screen_saver_display_duration(duration);
  }
  return RET_OK;
}

/* 初始化主页面 */
static ret_t init_setting_screen_enter_sleep_time_page(widget_t* win) {
  widget_set_style_color(win, "normal:bg_color", 0xff000000);

  /* 窗体动画 */
  widget_set_prop_str(win, WIDGET_PROP_ANIM_HINT, "htranslate(duration=500,easing=cubic_out)");

  widget_t* back = button_create(win, 104, 54, 40, 40);
  widget_set_text_utf8(back, ui_icon_back_image_font);
  widget_set_style_str(back, "normal:font_name", "icomoon");
  widget_set_style_int(back, "normal:font_size", 40);
  widget_set_style_color(back, "normal:text_color", 0x66ffffff);
  widget_set_style_str(back, "over:font_name", "icomoon");
  widget_set_style_int(back, "over:font_size", 40);
  widget_set_style_color(back, "over:text_color", 0x66ffffff);
  widget_set_style_str(back, "pressed:font_name", "icomoon");
  widget_set_style_int(back, "pressed:font_size", 40);
  widget_set_style_color(back, "pressed:text_color", 0x66ffffff);
  widget_on(back, EVT_CLICK, on_back, win);

  widget_t* button = button_create(win, 144, 56, 192, 32);
  widget_set_style_str(button, "normal:text_align_h", "center");
  widget_set_style_str(button, "normal:text_align_v", "middle");
  widget_set_style_str(button, "normal:font_name", "NotoSansSC_Regular");
  widget_set_style_int(button, "normal:font_size", 32);
  widget_set_style_color(button, "normal:text_color", 0xffffffff);
  
  widget_set_style_str(button, "over:text_align_h", "center");
  widget_set_style_str(button, "over:text_align_v", "middle");
  widget_set_style_str(button, "over:font_name", "NotoSansSC_Regular");
  widget_set_style_int(button, "over:font_size", 32);
  widget_set_style_color(button, "over:text_color", 0xffffffff);

  widget_set_style_str(button, "pressed:text_align_h", "center");
  widget_set_style_str(button, "pressed:text_align_v", "middle");
  widget_set_style_str(button, "pressed:font_name", "NotoSansSC_Regular");
  widget_set_style_int(button, "pressed:font_size", 32);
  widget_set_style_color(button, "pressed:text_color", 0xffffffff);

  widget_set_text_utf8(button, "屏保显示时长");

  widget_on(button, EVT_CLICK, on_button, button);


  widget_t* label = label_create(win, 60, 112, 360, 96);
  widget_set_style_str(label, "normal:text_align_h", "left");
  widget_set_style_str(label, "normal:text_align_v", "middle");
  widget_set_style_str(label, "normal:font_name", "NotoSansSC_Regular");
  widget_set_style_int(label, "normal:font_size", 36);
  widget_set_style_color(label, "normal:text_color", 0xffffffff);
  widget_set_text_utf8(label, "显示设定时长后,屏幕\n将自动进入休眠");


  widget_t* view = view_create(win, 56, 232, 368, 176);

  for (uint32_t i = 0; i < 3; i++) {
    widget_t* radio = check_button_create_radio(view, 0, 0, 176, 80);

    widget_set_style_color(radio, "normal:bg_color", 0xff1f1f1f);
    widget_set_style_color(radio, "normal:text_color", 0xb2ffffff);
  #if !defined(AWTK_NOT_ROUND_RADIUS)
    widget_set_style_int(radio, "normal:round_radius", 40);
  #endif
    widget_set_style_str(radio, "normal:font_name", "NotoSansSC_Regular");
    widget_set_style_int(radio, "normal:font_size", 28);

    widget_set_style_color(radio, "pressed:bg_color", 0xff1f1f1f);
    widget_set_style_color(radio, "pressed:text_color", 0xb2ffffff);
  #if !defined(AWTK_NOT_ROUND_RADIUS)
    widget_set_style_int(radio, "pressed:round_radius", 40);
  #endif
    widget_set_style_str(radio, "pressed:font_name", "NotoSansSC_Regular");
    widget_set_style_int(radio, "pressed:font_size", 28);

    widget_set_style_color(radio, "over:bg_color", 0xff1f1f1f);
    widget_set_style_color(radio, "over:text_color", 0xb2ffffff);
#if !defined(AWTK_NOT_ROUND_RADIUS)
    widget_set_style_int(radio, "over:round_radius", 40);
#endif
    widget_set_style_str(radio, "over:font_name", "NotoSansSC_Regular");
    widget_set_style_int(radio, "over:font_size", 28);

    widget_set_style_color(radio, "normal_of_checked:bg_color", 0xff466ae6);
    widget_set_style_color(radio, "normal_of_checked:text_color", 0xffffffff);
#if !defined(AWTK_NOT_ROUND_RADIUS)
    widget_set_style_int(radio, "normal_of_checked:round_radius", 40);
#endif
    widget_set_style_str(radio, "normal_of_checked:font_name", "NotoSansSC_Regular");
    widget_set_style_int(radio, "normal_of_checked:font_size", 28);

    widget_set_style_color(radio, "pressed_of_checked:bg_color", 0xff466ae6);
    widget_set_style_color(radio, "pressed_of_checked:text_color", 0xffffffff);
#if !defined(AWTK_NOT_ROUND_RADIUS)
    widget_set_style_int(radio, "pressed_of_checked:round_radius", 40);
#endif
    widget_set_style_str(radio, "pressed_of_checked:font_name", "NotoSansSC_Regular");
    widget_set_style_int(radio, "pressed_of_checked:font_size", 28);

    widget_set_style_color(radio, "over_of_checked:bg_color", 0xff466ae6);
    widget_set_style_color(radio, "over_of_checked:text_color", 0xffffffff);
#if !defined(AWTK_NOT_ROUND_RADIUS)
    widget_set_style_int(radio, "over_of_checked:round_radius", 40);
#endif
    widget_set_style_str(radio, "over_of_checked:font_name", "NotoSansSC_Regular");
    widget_set_style_int(radio, "over_of_checked:font_size", 28);

    widget_set_text_utf8(radio, view_item_data[i].text);
    widget_set_prop_int(radio, "duration", view_item_data[i].value);

    widget_on(radio, EVT_VALUE_CHANGED, on_radio, radio);
  }

  widget_set_children_layout(view, "default(r=2,c=2,s=16)");

  return RET_OK;
}

/**
 * 初始化窗口
 */
ret_t setting_screen_enter_sleep_time_page_init(widget_t* win, void* ctx) {
  (void)ctx;
  return_value_if_fail(win != NULL, RET_BAD_PARAMS);

  init_setting_screen_enter_sleep_time_page(win);

  return RET_OK;
}

自动进入屏保

效果预览

思路

实现

/*
	自动进入屏保
	src/pages/setting/setting_save_enter_time.c
*/
#include "awtk.h"
#include "../../common/navigator.h"
#include "../../common/ui_widget.h"
#include "../../common/ui_page_load.h"
#include "../../common/ui_cache_data.h"
#include "../../common/ui_font_icon.h"

#include "../../service/ui_setting_service.h"

#include "scroll_view/list_view.h"
#include "scroll_view/scroll_bar.h"
#include "scroll_view/scroll_view.h"

#include "ui_colmo_knob_common.h"


static ui_item_data_t view_item_data[4] = {
  [0] = {
    .value = 30 * 1000,
    .text = "30秒",
  },
  [1] = {
    .value = 1 * 60 * 1000,
    .text = "1分钟",
  },
  [2] = {
    .value = 2 * 60 * 1000,
    .text = "2分钟",
  },
  [3] = {
    .value = 0xffffffff,
    .text = "关闭",
  }
};

static ret_t on_button(void* ctx, event_t* e) {
  return navigator_back();
}

static ret_t on_back(void* ctx, event_t* e) {
  return navigator_back();
}

static ret_t on_radio(void* ctx, event_t* e) {
  widget_t* radio = WIDGET(ctx);
  uint32_t duration = widget_get_prop_int(radio, "duration", 0);
  bool_t value = widget_get_prop_bool(radio, WIDGET_PROP_VALUE, 0);
  if (value) {
    ui_set_open_screen_saver_display_duration(duration);
    window_manager_set_screen_saver_time(window_manager(), duration);
    MLOG_I("duration = %d\r\n", duration);
  }
  return RET_OK;
}

/* 初始化主页面 */
static ret_t init_setting_screen_save_enter_time_page(widget_t* win) {
  widget_set_style_color(win, "normal:bg_color", 0xff000000);

  /* 窗体动画 */
  widget_set_prop_str(win, WIDGET_PROP_ANIM_HINT, "htranslate(duration=500,easing=cubic_out)");

  widget_t* back = button_create(win, 104, 54, 40, 40);
  widget_set_text_utf8(back, ui_icon_back_image_font);
  widget_set_style_str(back, "normal:font_name", "icomoon");
  widget_set_style_int(back, "normal:font_size", 40);
  widget_set_style_color(back, "normal:text_color", 0x66ffffff);
  widget_set_style_str(back, "over:font_name", "icomoon");
  widget_set_style_int(back, "over:font_size", 40);
  widget_set_style_color(back, "over:text_color", 0x66ffffff);
  widget_set_style_str(back, "pressed:font_name", "icomoon");
  widget_set_style_int(back, "pressed:font_size", 40);
  widget_set_style_color(back, "pressed:text_color", 0x66ffffff);
  widget_on(back, EVT_CLICK, on_back, win);

  widget_t* button = button_create(win, 144, 56, 192, 32);
  widget_set_style_str(button, "normal:text_align_h", "center");
  widget_set_style_str(button, "normal:text_align_v", "middle");
  widget_set_style_str(button, "normal:font_name", "NotoSansSC_Regular");
  widget_set_style_int(button, "normal:font_size", 32);
  widget_set_style_color(button, "normal:text_color", 0xffffffff);
  
  widget_set_style_str(button, "over:text_align_h", "center");
  widget_set_style_str(button, "over:text_align_v", "middle");
  widget_set_style_str(button, "over:font_name", "NotoSansSC_Regular");
  widget_set_style_int(button, "over:font_size", 32);
  widget_set_style_color(button, "over:text_color", 0xffffffff);

  widget_set_style_str(button, "pressed:text_align_h", "center");
  widget_set_style_str(button, "pressed:text_align_v", "middle");
  widget_set_style_str(button, "pressed:font_name", "NotoSansSC_Regular");
  widget_set_style_int(button, "pressed:font_size", 32);
  widget_set_style_color(button, "pressed:text_color", 0xffffffff);

  widget_set_text_utf8(button, "自动进入屏保");

  widget_on(button, EVT_CLICK, on_button, button);


  widget_t* label = label_create(win, 60, 112, 360, 96);
  widget_set_style_str(label, "normal:text_align_h", "center");
  widget_set_style_str(label, "normal:text_align_v", "middle");
  widget_set_style_str(label, "normal:font_name", "NotoSansSC_Regular");
  widget_set_style_int(label, "normal:font_size", 36);
  widget_set_style_color(label, "normal:text_color", 0xffffffff);
  widget_set_text_utf8(label, "在设定时间无操作,屏\n幕将自动进入屏保状态");


  widget_t* view = view_create(win, 56, 232, 368, 176);

  for (uint32_t i = 0; i < 4; i++) {
    widget_t* radio = check_button_create_radio(view, 0, 0, 176, 80);

    widget_set_style_color(radio, "normal:bg_color", 0xff1f1f1f);
    widget_set_style_color(radio, "normal:text_color", 0xb2ffffff);
#if !defined(AWTK_NOT_ROUND_RADIUS)
    widget_set_style_int(radio, "normal:round_radius", 40);
#endif
    widget_set_style_str(radio, "normal:font_name", "NotoSansSC_Regular");
    widget_set_style_int(radio, "normal:font_size", 28);

    widget_set_style_color(radio, "pressed:bg_color", 0xff1f1f1f);
    widget_set_style_color(radio, "pressed:text_color", 0xb2ffffff);
#if !defined(AWTK_NOT_ROUND_RADIUS)
    widget_set_style_int(radio, "pressed:round_radius", 40);
#endif
    widget_set_style_str(radio, "pressed:font_name", "NotoSansSC_Regular");
    widget_set_style_int(radio, "pressed:font_size", 28);

    widget_set_style_color(radio, "over:bg_color", 0xff1f1f1f);
    widget_set_style_color(radio, "over:text_color", 0xb2ffffff);
#if !defined(AWTK_NOT_ROUND_RADIUS)
    widget_set_style_int(radio, "over:round_radius", 40);
#endif
    widget_set_style_str(radio, "over:font_name", "NotoSansSC_Regular");
    widget_set_style_int(radio, "over:font_size", 28);

    widget_set_style_color(radio, "normal_of_checked:bg_color", 0xff466ae6);
    widget_set_style_color(radio, "normal_of_checked:text_color", 0xffffffff);
#if !defined(AWTK_NOT_ROUND_RADIUS)
    widget_set_style_int(radio, "normal_of_checked:round_radius", 40);
#endif
    widget_set_style_str(radio, "normal_of_checked:font_name", "NotoSansSC_Regular");
    widget_set_style_int(radio, "normal_of_checked:font_size", 28);

    widget_set_style_color(radio, "pressed_of_checked:bg_color", 0xff466ae6);
    widget_set_style_color(radio, "pressed_of_checked:text_color", 0xffffffff);
#if !defined(AWTK_NOT_ROUND_RADIUS)
    widget_set_style_int(radio, "pressed_of_checked:round_radius", 40);
#endif
    widget_set_style_str(radio, "pressed_of_checked:font_name", "NotoSansSC_Regular");
    widget_set_style_int(radio, "pressed_of_checked:font_size", 28);

    widget_set_style_color(radio, "over_of_checked:bg_color", 0xff466ae6);
    widget_set_style_color(radio, "over_of_checked:text_color", 0xffffffff);
#if !defined(AWTK_NOT_ROUND_RADIUS)
    widget_set_style_int(radio, "over_of_checked:round_radius", 40);
#endif
    widget_set_style_str(radio, "over_of_checked:font_name", "NotoSansSC_Regular");
    widget_set_style_int(radio, "over_of_checked:font_size", 28);

    widget_set_text_utf8(radio, view_item_data[i].text);
    widget_set_prop_int(radio, "duration", view_item_data[i].value);

    widget_on(radio, EVT_VALUE_CHANGED, on_radio, radio);
  }

  widget_set_children_layout(view, "default(r=2,c=2,s=16)");

  return RET_OK;
}

/**
 * 初始化窗口
 */
ret_t setting_screen_save_enter_time_page_init(widget_t* win, void* ctx) {
  (void)ctx;
  return_value_if_fail(win != NULL, RET_BAD_PARAMS);

  init_setting_screen_save_enter_time_page(win);

  return RET_OK;
}

屏保亮度

效果预览

思路

  1. 圆环背景

      widget_t* image = image_create(win, 0, 0, 480, 480);
      image_set_image(image, "light_000");
      image_set_draw_type(image, IMAGE_DRAW_ICON);
    
  2. 值改变事件

    // 自动亮度 点击事件
    static ret_t on_changed(void* ctx, event_t* e) {
      widget_t* win = WIDGET(ctx);
      widget_t* label_auto = widget_lookup(win, "label_auto", FALSE);
      widget_t* percent = widget_lookup(win, "percent", FALSE);
      widget_t* unit = widget_lookup(win, "unit", FALSE);
      widget_t* brightness = widget_lookup(win, "brightness", FALSE);
      value_change_event_t* evt = (value_change_event_t*)e;
      if (evt->new_value.value.u32) {
        widget_set_visible(label_auto, TRUE);
        widget_set_visible(percent, FALSE);
        widget_set_visible(unit, FALSE);
        widget_set_sensitive(brightness, FALSE);
        ui_set_screen_brightness_auto_config(1);
      } else {
        widget_set_visible(label_auto, FALSE);
        widget_set_visible(percent, TRUE);
        widget_set_visible(unit, TRUE);
        widget_set_sensitive(brightness, TRUE);
        ui_set_screen_brightness_auto_config(0);
      }
      return RET_OK;
    }
    
    // 值改变时,ui背景及数值同步变化
    static ret_t ui_progress_value_changing(void *ctx, event_t *e) {
      widget_t* image = WIDGET(ctx);
      widget_t* widget = WIDGET(e->target);
      widget_t* win = image->parent;
      return_value_if_fail(image != NULL, RET_BAD_PARAMS);
      return_value_if_fail(widget != NULL, RET_BAD_PARAMS);
      return_value_if_fail(win != NULL, RET_BAD_PARAMS);
    
      widget_t* percent = widget_lookup(win, "percent", FALSE);
      widget_t* unit = widget_lookup(win, "unit", FALSE);
      return_value_if_fail(percent != NULL, RET_BAD_PARAMS);
      return_value_if_fail(unit != NULL, RET_BAD_PARAMS);
    
      int int_value = widget_get_prop_int(widget, WIDGET_PROP_VALUE, 0);
    
      const int max_value = 385;
      const int min_value = 155;
      float progress_value = 0;
      int progress_value_int = 0;
    
      if (int_value <= min_value) {
          int_value = min_value;
          progress_value = 0;
          progress_value_int = 0;
      } else if (int_value > max_value) {
          int_value = max_value;
          progress_value = 1;
          progress_value_int = 100;
      } else {
          progress_value = (float)(int_value - min_value) / (max_value - min_value);
          progress_value_int = round(progress_value * 100);
      }
    
      char bg_img_xxx[256];
      tk_snprintf(bg_img_xxx, sizeof(bg_img_xxx), "light_%03d", progress_value_int);
    
      image_set_image(image, bg_img_xxx);
      image_set_draw_type(image, IMAGE_DRAW_ICON);
    
      tk_snprintf(bg_img_xxx, sizeof(bg_img_xxx), "%d", progress_value_int);
      widget_set_text_utf8(percent, bg_img_xxx);
      float_t leng = widget_measure_text(percent, percent->text.str);
      widget_set_prop_int(percent, WIDGET_PROP_W, (int)leng);
      widget_set_prop_int(percent, WIDGET_PROP_X, (480 - (int)leng) / 2);
      widget_set_prop_int(unit, WIDGET_PROP_X, percent->x + percent->w + 8);
    
      return RET_OK;
    }
    
    // 值改变后,同步背景变化
    static ret_t ui_progress_value_changed(void *ctx, event_t *e) {
      (void)ctx;
      widget_t* widget = WIDGET(e->target);
    
      int int_value = widget_get_prop_int(widget, WIDGET_PROP_VALUE, 0);
    
      const int max_value = 385;
      const int min_value = 155;
      float progress_value = 0;
      int progress_value_int = 0;
    
      if (int_value <= min_value) {
          int_value = min_value;
          progress_value = 0;
          progress_value_int = 0;
      } else if (int_value > max_value) {
          int_value = max_value;
          progress_value = 1;
          progress_value_int = 100;
      } else {
          progress_value = (float)(int_value - min_value) / (max_value - min_value);
          progress_value_int = round(progress_value * 100);
      }
    
      ui_set_screen_brightness(progress_value_int);
    
      return RET_OK;
    }
    
  3. ui控件同步data数据

      // 弧形滑动条
      widget_t* brightness_prog = ui_factory_create_base_arc(win,0,0,480,480,"brightness");
      widget_set_name(brightness_prog, "brightness");
      widget_on(brightness_prog, EVT_VALUE_CHANGING, ui_progress_value_changing, image);
      widget_on(brightness_prog, EVT_VALUE_CHANGED, ui_progress_value_changed, image);
      int min = widget_get_prop_int(brightness_prog, SLIDER_CIRCLE_PROP_MIN, 0);
      int max = widget_get_prop_int(brightness_prog, SLIDER_CIRCLE_PROP_MAX, 0);
      widget_set_value(brightness_prog, (float_t)(data->brightness * (max - min) / 100 + min));//同步data数据
    
      // 自动亮度 按钮
      widget_t* auto_button = check_button_create(win, 204, 392, 72, 73);
    	... 
      widget_set_text_utf8(auto_button, ui_icon_automatic);
      widget_on(auto_button, EVT_VALUE_CHANGED, on_changed, win);
      check_button_set_value(auto_button, (bool_t)(data->brightness_auto));//同步data数据
    

实现

// src/pages/setting/setting_screen_brightness.c
#include "awtk.h"
#include "../../common/navigator.h"
#include "../../common/ui_widget.h"
#include "../../common/ui_base_arc.h"
#include "../../common/ui_page_load.h"
#include "../../common/ui_cache_data.h"
#include "../../common/ui_font_icon.h"

#include "../../service/ui_setting_service.h"

#include "scroll_view/list_view.h"
#include "scroll_view/scroll_bar.h"
#include "scroll_view/scroll_view.h"

#include "ui_colmo_knob_common.h"
#include "setting_common.h"


static ret_t on_back(void* ctx, event_t* e) {
  return navigator_back();
}

static ret_t on_changed(void* ctx, event_t* e) {
  widget_t* win = WIDGET(ctx);
  widget_t* label_auto = widget_lookup(win, "label_auto", FALSE);
  widget_t* percent = widget_lookup(win, "percent", FALSE);
  widget_t* unit = widget_lookup(win, "unit", FALSE);
  widget_t* brightness = widget_lookup(win, "brightness", FALSE);
  value_change_event_t* evt = (value_change_event_t*)e;
  if (evt->new_value.value.u32) {
    widget_set_visible(label_auto, TRUE);
    widget_set_visible(percent, FALSE);
    widget_set_visible(unit, FALSE);
    widget_set_sensitive(brightness, FALSE);
    ui_set_screen_brightness_auto_config(1);
  } else {
    widget_set_visible(label_auto, FALSE);
    widget_set_visible(percent, TRUE);
    widget_set_visible(unit, TRUE);
    widget_set_sensitive(brightness, TRUE);
    ui_set_screen_brightness_auto_config(0);
  }
  return RET_OK;
}

static ret_t ui_progress_value_changing(void *ctx, event_t *e) {
  widget_t* image = WIDGET(ctx);
  widget_t* widget = WIDGET(e->target);
  widget_t* win = image->parent;
  return_value_if_fail(image != NULL, RET_BAD_PARAMS);
  return_value_if_fail(widget != NULL, RET_BAD_PARAMS);
  return_value_if_fail(win != NULL, RET_BAD_PARAMS);

  widget_t* percent = widget_lookup(win, "percent", FALSE);
  widget_t* unit = widget_lookup(win, "unit", FALSE);
  return_value_if_fail(percent != NULL, RET_BAD_PARAMS);
  return_value_if_fail(unit != NULL, RET_BAD_PARAMS);

  int int_value = widget_get_prop_int(widget, WIDGET_PROP_VALUE, 0);

  const int max_value = 385;
  const int min_value = 155;
  float progress_value = 0;
  int progress_value_int = 0;

  if (int_value <= min_value) {
      int_value = min_value;
      progress_value = 0;
      progress_value_int = 0;
  } else if (int_value > max_value) {
      int_value = max_value;
      progress_value = 1;
      progress_value_int = 100;
  } else {
      progress_value = (float)(int_value - min_value) / (max_value - min_value);
      progress_value_int = round(progress_value * 100);
  }

  char bg_img_xxx[256];
  tk_snprintf(bg_img_xxx, sizeof(bg_img_xxx), "light_%03d", progress_value_int);

  image_set_image(image, bg_img_xxx);
  image_set_draw_type(image, IMAGE_DRAW_ICON);

  tk_snprintf(bg_img_xxx, sizeof(bg_img_xxx), "%d", progress_value_int);
  widget_set_text_utf8(percent, bg_img_xxx);
  float_t leng = widget_measure_text(percent, percent->text.str);
  widget_set_prop_int(percent, WIDGET_PROP_W, (int)leng);
  widget_set_prop_int(percent, WIDGET_PROP_X, (480 - (int)leng) / 2);
  widget_set_prop_int(unit, WIDGET_PROP_X, percent->x + percent->w + 8);

  return RET_OK;
}

static ret_t ui_progress_value_changed(void *ctx, event_t *e) {
  (void)ctx;
  widget_t* widget = WIDGET(e->target);

  int int_value = widget_get_prop_int(widget, WIDGET_PROP_VALUE, 0);

  const int max_value = 385;
  const int min_value = 155;
  float progress_value = 0;
  int progress_value_int = 0;

  if (int_value <= min_value) {
      int_value = min_value;
      progress_value = 0;
      progress_value_int = 0;
  } else if (int_value > max_value) {
      int_value = max_value;
      progress_value = 1;
      progress_value_int = 100;
  } else {
      progress_value = (float)(int_value - min_value) / (max_value - min_value);
      progress_value_int = round(progress_value * 100);
  }

  ui_set_screen_brightness(progress_value_int);

  return RET_OK;
}

/* 初始化主页面 */
static ret_t init_setting_screen_brightness_page(widget_t* win, ui_cache_data_t* data) {
  widget_set_style_color(win, "normal:bg_color", 0xff000000);

  /* 窗体动画 */
  widget_set_prop_str(win, WIDGET_PROP_ANIM_HINT, "htranslate(duration=500,easing=cubic_out)");

  widget_t* image = image_create(win, 0, 0, 480, 480);
  image_set_image(image, "light_000");
  image_set_draw_type(image, IMAGE_DRAW_ICON);

  widget_t* brightness_prog = ui_factory_create_base_arc(win,0,0,480,480,"brightness");
  widget_set_name(brightness_prog, "brightness");
  widget_on(brightness_prog, EVT_VALUE_CHANGING, ui_progress_value_changing, image);
  widget_on(brightness_prog, EVT_VALUE_CHANGED, ui_progress_value_changed, image);
  int min = widget_get_prop_int(brightness_prog, SLIDER_CIRCLE_PROP_MIN, 0);
  int max = widget_get_prop_int(brightness_prog, SLIDER_CIRCLE_PROP_MAX, 0);
  widget_set_value(brightness_prog, (float_t)(data->brightness * (max - min) / 100 + min));

  widget_t* back = button_create(win, 144, 320, 192, 44);
  widget_t* label = label_create(back, -8, 4, 40, 40);
  widget_set_style_str(label, "normal:text_align_h", "center");
  widget_set_style_str(label, "normal:text_align_v", "middle");
  widget_set_style_str(label, "normal:font_name", "icomoon");
  widget_set_style_int(label, "normal:font_size", 40);
  widget_set_style_color(label, "normal:text_color", 0x66ffffff);
  widget_set_text_utf8(label, ui_icon_back_image_font);

  widget_t* label1 = label_create(back, 32, 4, 128, 32);
  widget_set_style_str(label1, "normal:text_align_h", "center");
  widget_set_style_str(label1, "normal:text_align_v", "middle");
  widget_set_style_str(label1, "normal:font_name", "NotoSansSC_Regular");
  widget_set_style_int(label1, "normal:font_size", 32);
  widget_set_style_color(label1, "normal:text_color", 0xffffffff);
  widget_set_text_utf8(label1, "屏幕亮度");

  widget_t* label_auto = label_create(win, 176, 200, 128, 64);
  widget_set_name(label_auto, "label_auto");
  widget_set_style_str(label_auto, "normal:text_align_h", "center");
  widget_set_style_str(label_auto, "normal:text_align_v", "middle");
  widget_set_style_str(label_auto, "normal:font_name", "NotoSansSC_Regular");
  widget_set_style_int(label_auto, "normal:font_size", 64);
  widget_set_style_color(label_auto, "normal:text_color", 0xffffffff);
  widget_set_text_utf8(label_auto, "自动");
  widget_set_visible(label_auto, FALSE);

  widget_t* percent = label_create(win, 137, 132, 205, 184);
  widget_set_name(percent, "percent");
  widget_set_style_str(percent, "normal:text_align_h", "center");
  widget_set_style_str(percent, "normal:text_align_v", "middle");
  widget_set_style_str(percent, "normal:font_name", "COLMO-Mono-Regular");
  widget_set_style_int(percent, "normal:font_size", 184);
  widget_set_style_color(percent, "normal:text_color", 0xffffffff);
  widget_set_text_utf8(percent, "40");

  widget_t* unit = label_create(win, 350, 152, 49, 56);
  widget_set_name(unit, "unit");
  widget_set_style_str(unit, "normal:text_align_h", "center");
  widget_set_style_str(unit, "normal:text_align_v", "middle");
  widget_set_style_str(unit, "normal:font_name", "COLMO-Mono-Regular");
  widget_set_style_int(unit, "normal:font_size", 56);
  widget_set_style_color(unit, "normal:text_color", 0x66ffffff);
  widget_set_text_utf8(unit, "%");

  widget_t* auto_button = check_button_create(win, 204, 392, 72, 73);
  widget_set_style_str(auto_button, "normal:text_align_h", "center");
  widget_set_style_str(auto_button, "normal:text_align_v", "middle");
  widget_set_style_str(auto_button, "normal:font_name", "icomoon");
  widget_set_style_int(auto_button, "normal:font_size", 72);
  widget_set_style_color(auto_button, "normal:text_color", 0x66ffffff);

  widget_set_style_str(auto_button, "over:text_align_h", "center");
  widget_set_style_str(auto_button, "over:text_align_v", "middle");
  widget_set_style_str(auto_button, "over:font_name", "icomoon");
  widget_set_style_int(auto_button, "over:font_size", 72);
  widget_set_style_color(auto_button, "over:text_color", 0x66ffffff);

  widget_set_style_str(auto_button, "pressed:text_align_h", "center");
  widget_set_style_str(auto_button, "pressed:text_align_v", "middle");
  widget_set_style_str(auto_button, "pressed:font_name", "icomoon");
  widget_set_style_int(auto_button, "pressed:font_size", 72);
  widget_set_style_color(auto_button, "pressed:text_color", 0x66ffffff);

  widget_set_style_str(auto_button, "normal_of_checked:text_align_h", "center");
  widget_set_style_str(auto_button, "normal_of_checked:text_align_v", "middle");
  widget_set_style_str(auto_button, "normal_of_checked:font_name", "icomoon");
  widget_set_style_int(auto_button, "normal_of_checked:font_size", 72);
  widget_set_style_color(auto_button, "normal_of_checked:text_color", 0xffffffff);

  widget_set_style_str(auto_button, "over_of_checked:text_align_h", "center");
  widget_set_style_str(auto_button, "over_of_checked:text_align_v", "middle");
  widget_set_style_str(auto_button, "over_of_checked:font_name", "icomoon");
  widget_set_style_int(auto_button, "over_of_checked:font_size", 72);
  widget_set_style_color(auto_button, "over_of_checked:text_color", 0xffffffff);

  widget_set_style_str(auto_button, "pressed_of_checked:text_align_h", "center");
  widget_set_style_str(auto_button, "pressed_of_checked:text_align_v", "middle");
  widget_set_style_str(auto_button, "pressed_of_checked:font_name", "icomoon");
  widget_set_style_int(auto_button, "pressed_of_checked:font_size", 72);
  widget_set_style_color(auto_button, "pressed_of_checked:text_color", 0xffffffff);

  widget_set_text_utf8(auto_button, ui_icon_automatic);

  widget_on(auto_button, EVT_VALUE_CHANGED, on_changed, win);
  widget_on(back, EVT_CLICK, on_back, win);

  check_button_set_value(auto_button, (bool_t)(data->brightness_auto));

  return RET_OK;
}

/**
 * 初始化窗口
 */
ret_t setting_screen_brightness_page_init(widget_t* win, void* ctx) {
  (void)ctx;
  return_value_if_fail(win != NULL, RET_BAD_PARAMS);

  ui_cache_data_t* ui_cache_data = setting_get_ui_cache_data();
  init_setting_screen_brightness_page(win, ui_cache_data);

  return RET_OK;
}

提示音量

效果预览

思路

  1. 圆环背景,同屏保亮度
  2. 值改变,同屏保亮度
  3. ui控件同步data数据 ,同屏保亮度

实现

// src/pages/setting/setting_volume_page.c
#include "awtk.h"
#include "../../common/navigator.h"
#include "../../common/ui_widget.h"
#include "../../common/ui_base_arc.h"
#include "../../common/ui_page_load.h"
#include "../../common/ui_cache_data.h"
#include "../../common/ui_font_icon.h"

#include "scroll_view/list_view.h"
#include "scroll_view/scroll_bar.h"
#include "scroll_view/scroll_view.h"

#include "ui_colmo_knob_common.h"

#include "../../service/ui_setting_service.h"
#include "setting_common.h"


static ret_t on_back(void* ctx, event_t* e) {
  return navigator_back();
}

static ret_t ui_progress_value_changing(void *ctx, event_t *e) {
  widget_t* image = WIDGET(ctx);
  widget_t* widget = WIDGET(e->target);
  widget_t* win = image->parent;
  return_value_if_fail(widget != NULL, RET_BAD_PARAMS);

  widget_t* percent = widget_lookup(win, "percent", FALSE);
  widget_t* unit = widget_lookup(win, "unit", FALSE);

  int int_value = widget_get_prop_int(widget, WIDGET_PROP_VALUE, 0);

  const int max_value = 385;
  const int min_value = 155;
  float progress_value = 0;
  int progress_value_int = 0;

  if (int_value <= min_value) {
      int_value = min_value;
      progress_value = 0;
      progress_value_int = 0;
  } else if (int_value > max_value) {
      int_value = max_value;
      progress_value = 1;
      progress_value_int = 100;
  } else {
      progress_value = (float)(int_value - min_value) / (max_value - min_value);
      progress_value_int = round(progress_value * 100);
  }

  char bg_img_xxx[256];
  tk_snprintf(bg_img_xxx, sizeof(bg_img_xxx), "light_%03d", progress_value_int);

  image_set_image(image, bg_img_xxx);
  image_set_draw_type(image, IMAGE_DRAW_ICON);

  tk_snprintf(bg_img_xxx, sizeof(bg_img_xxx), "%d", progress_value_int);
  widget_set_text_utf8(percent, bg_img_xxx);
  float_t leng = widget_measure_text(percent, percent->text.str);
  widget_set_prop_int(percent, WIDGET_PROP_W, (int)leng);
  widget_set_prop_int(percent, WIDGET_PROP_X, (480 - (int)leng) / 2);
  widget_set_prop_int(unit, WIDGET_PROP_X, percent->x + percent->w + 8);

  return RET_OK;
}

static ret_t ui_progress_value_changed(void *ctx, event_t *e) {
  (void)ctx;
  widget_t* widget = WIDGET(e->target);
  return_value_if_fail(widget != NULL, RET_BAD_PARAMS);

  int int_value = widget_get_prop_int(widget, WIDGET_PROP_VALUE, 0);

  const int max_value = 385;
  const int min_value = 155;
  float progress_value = 0;
  int progress_value_int = 0;

  if (int_value <= min_value) {
      int_value = min_value;
      progress_value = 0;
      progress_value_int = 0;
  } else if (int_value > max_value) {
      int_value = max_value;
      progress_value = 1;
      progress_value_int = 100;
  } else {
      progress_value = (float)(int_value - min_value) / (max_value - min_value);
      progress_value_int = round(progress_value * 100);
  }

  ui_set_prompt_volume(progress_value_int);

  return RET_OK;
}

/* 初始化主页面 */
static ret_t init_setting_volume_page(widget_t* win, ui_cache_data_t* data) {
  widget_set_style_color(win, "normal:bg_color", 0xff000000);

  /* 窗体动画 */
  widget_set_prop_str(win, WIDGET_PROP_ANIM_HINT, "htranslate(duration=500,easing=cubic_out)");

  widget_t* image = image_create(win, 0, 0, 480, 480);
  image_set_image(image, "light_000");
  image_set_draw_type(image, IMAGE_DRAW_ICON);

  widget_t* prog = ui_factory_create_base_arc(win,0,0,480,480,"brightness");
  widget_on(prog, EVT_VALUE_CHANGING, ui_progress_value_changing, image);
  widget_on(prog, EVT_VALUE_CHANGED, ui_progress_value_changed, image);
  int min = widget_get_prop_int(prog, SLIDER_CIRCLE_PROP_MIN, 0);
  int max = widget_get_prop_int(prog, SLIDER_CIRCLE_PROP_MAX, 0);
  widget_set_value(prog, (float_t)(data->volume * (max - min) / 100 + min));

  widget_t* back = button_create(win, 144, 320, 192, 44);
  widget_t* label = label_create(back, -8, 4, 40, 40);
  widget_set_style_str(label, "normal:text_align_h", "center");
  widget_set_style_str(label, "normal:text_align_v", "middle");
  widget_set_style_str(label, "normal:font_name", "icomoon");
  widget_set_style_int(label, "normal:font_size", 40);
  widget_set_style_color(label, "normal:text_color", 0x66ffffff);
  widget_set_text_utf8(label, ui_icon_back_image_font);

  widget_t* label1 = label_create(back, 32, 4, 128, 32);
  widget_set_style_str(label1, "normal:text_align_h", "center");
  widget_set_style_str(label1, "normal:text_align_v", "middle");
  widget_set_style_str(label1, "normal:font_name", "NotoSansSC_Regular");
  widget_set_style_int(label1, "normal:font_size", 32);
  widget_set_style_color(label1, "normal:text_color", 0xffffffff);
  widget_set_text_utf8(label1, "提示音量");

  widget_t* percent = label_create(win, 137, 132, 205, 184);
  widget_set_name(percent, "percent");
  widget_set_style_str(percent, "normal:text_align_h", "center");
  widget_set_style_str(percent, "normal:text_align_v", "middle");
  widget_set_style_str(percent, "normal:font_name", "COLMO-Mono-Regular");
  widget_set_style_int(percent, "normal:font_size", 184);
  widget_set_style_color(percent, "normal:text_color", 0xffffffff);
  widget_set_text_utf8(percent, "40");

  widget_t* unit = label_create(win, 350, 152, 49, 56);
  widget_set_name(unit, "unit");
  widget_set_style_str(unit, "normal:text_align_h", "center");
  widget_set_style_str(unit, "normal:text_align_v", "middle");
  widget_set_style_str(unit, "normal:font_name", "COLMO-Mono-Regular");
  widget_set_style_int(unit, "normal:font_size", 56);
  widget_set_style_color(unit, "normal:text_color", 0x66ffffff);
  widget_set_text_utf8(unit, "%");

  widget_on(back, EVT_CLICK, on_back, win);

  return RET_OK;
}

/**
 * 初始化窗口
 */
ret_t setting_volume_page_init(widget_t* win, void* ctx) {
  (void)ctx;
  return_value_if_fail(win != NULL, RET_BAD_PARAMS);

  ui_cache_data_t* ui_cache_data = setting_get_ui_cache_data();
  init_setting_volume_page(win, ui_cache_data);

  return RET_OK;
}

靠近亮屏

效果预览

思路

  1. 圆环背景,同屏保亮度
  2. 值改变,同屏保亮度
  3. ui控件同步data数据 ,同屏保亮度

实现

// src/pages/setting/setting_proximity_wake_up.c
#include "awtk.h"
#include "../../common/navigator.h"
#include "../../common/ui_widget.h"
#include "../../common/ui_base_arc.h"
#include "../../common/ui_page_load.h"
#include "../../common/ui_cache_data.h"
#include "../../common/ui_font_icon.h"

#include "scroll_view/list_view.h"
#include "scroll_view/scroll_bar.h"
#include "scroll_view/scroll_view.h"

#include "ui_colmo_knob_common.h"

#include "../../service/ui_setting_service.h"
#include "setting_common.h"

static ret_t on_back(void* ctx, event_t* e) {
  return navigator_back();
}

static ret_t on_changed(void* ctx, event_t* e) {
  widget_t* win = WIDGET(ctx);
  widget_t* brightness = widget_lookup(win, "brightness", FALSE);
  widget_t* sensibility = widget_lookup(win, "sensibility", FALSE);

  value_change_event_t* evt = (value_change_event_t*)e;
  if (evt->new_value.value.u32) {
    widget_set_enable(brightness, TRUE);
    int min = widget_get_prop_int(brightness, SLIDER_CIRCLE_PROP_MIN, 0);
    int max = widget_get_prop_int(brightness, SLIDER_CIRCLE_PROP_MAX, 0);
    int int_value = widget_get_prop_int(brightness, WIDGET_PROP_VALUE, 0);
    float_t percent = (float)(int_value - min) / (max - min);
    if (percent >= 0.0f && percent < 0.5f) {
      widget_set_text_utf8(sensibility, "低");
    } 
    else if (percent >= 0.5f && percent < 1.0f) {
      widget_set_text_utf8(sensibility, "中");
    }
    else if (percent >= 1.0f) {
      widget_set_text_utf8(sensibility, "高");
    }
    ui_set_close_or_open_light_screen(true); /* 打开 */
  } else {
    widget_set_enable(brightness, FALSE);
    widget_set_text_utf8(sensibility, "已关闭");
    ui_set_close_or_open_light_screen(false); /* 关闭 */
  }

  return RET_OK;
}

static ret_t ui_progress_value_changing(void *ctx, event_t *e) {
  widget_t* image = WIDGET(ctx);
  widget_t* widget = WIDGET(e->target);
  widget_t* win = image->parent;
  return_value_if_fail(widget != NULL, RET_BAD_PARAMS);

  int int_value = widget_get_prop_int(widget, WIDGET_PROP_VALUE, 0);

  const int max_value = 385;
  const int min_value = 155;
  float progress_value = 0;
  int progress_value_int = 0;

  if (int_value <= min_value) {
      int_value = min_value;
      progress_value = 0;
      progress_value_int = 0;
  } else if (int_value > max_value) {
      int_value = max_value;
      progress_value = 1;
      progress_value_int = 100;
  } else {
      progress_value = (float)(int_value - min_value) / (max_value - min_value);
      progress_value_int = round(progress_value * 100);
  }

  char bg_img_xxx[256];
  tk_snprintf(bg_img_xxx, sizeof(bg_img_xxx), "light_%03d", progress_value_int);

  image_set_image(image, bg_img_xxx);
  image_set_draw_type(image, IMAGE_DRAW_ICON);

  widget_t* sensibility = widget_lookup(win, "sensibility", FALSE);
  if (progress_value >= 0.0f && progress_value < 0.5f) {
    widget_set_text_utf8(sensibility, "低");
  } 
  else if (progress_value >= 0.5f && progress_value < 1.0f) {
    widget_set_text_utf8(sensibility, "中");
  }
  else if (progress_value >= 1.0f) {
    widget_set_text_utf8(sensibility, "高");
  }

  return RET_OK;
}

static ret_t ui_progress_value_changed(void *ctx, event_t *e) {
  widget_t* image = WIDGET(ctx);
  widget_t* widget = WIDGET(e->target);
  widget_t* win = image->parent;
  return_value_if_fail(widget != NULL, RET_BAD_PARAMS);

  int int_value = widget_get_prop_int(widget, WIDGET_PROP_VALUE, 0);

  const int max_value = 385;
  const int min_value = 155;
  float progress_value = 0;
  int progress_value_int = 0;

  if (int_value <= min_value) {
      int_value = min_value;
      progress_value = 0;
      progress_value_int = 0;
  } else if (int_value > max_value) {
      int_value = max_value;
      progress_value = 1;
      progress_value_int = 100;
  } else {
      progress_value = (float)(int_value - min_value) / (max_value - min_value);
      progress_value_int = round(progress_value * 100);
  }

  if (progress_value >= 0.0f && progress_value < 0.5f) {
    ui_set_close_or_open_light_screen_sensing_distance(0);
  } 
  else if (progress_value >= 0.5f && progress_value < 1.0f) {
    ui_set_close_or_open_light_screen_sensing_distance(1);
  }
  else if (progress_value >= 1.0f) {
    ui_set_close_or_open_light_screen_sensing_distance(2);
  }

  return RET_OK;
}

/* 初始化主页面 */
static ret_t init_setting_proximity_wake_up_page(widget_t* win, ui_cache_data_t* data) {
  widget_set_style_color(win, "normal:bg_color", 0xff000000);

  /* 窗体动画 */
  widget_set_prop_str(win, WIDGET_PROP_ANIM_HINT, "htranslate(duration=500,easing=cubic_out)");

  widget_t* image = image_create(win, 0, 0, 480, 480);
  image_set_image(image, "light_000");
  image_set_draw_type(image, IMAGE_DRAW_ICON);

  widget_t* prog = ui_factory_create_base_arc(win,0,0,480,480,"brightness");
  widget_set_name(prog, "brightness");
  widget_on(prog, EVT_VALUE_CHANGING, ui_progress_value_changing, image);
  widget_on(prog, EVT_VALUE_CHANGED, ui_progress_value_changed, image);

  widget_t* back = button_create(win, 144, 320, 192, 44);
  widget_t* label = label_create(back, -8, 4, 40, 40);
  widget_set_style_str(label, "normal:text_align_h", "center");
  widget_set_style_str(label, "normal:text_align_v", "middle");
  widget_set_style_str(label, "normal:font_name", "icomoon");
  widget_set_style_int(label, "normal:font_size", 40);
  widget_set_style_color(label, "normal:text_color", 0x66ffffff);
  widget_set_text_utf8(label, ui_icon_back_image_font);

  widget_t* label1 = label_create(back, 32, 4, 128, 32);
  widget_set_style_str(label1, "normal:text_align_h", "center");
  widget_set_style_str(label1, "normal:text_align_v", "middle");
  widget_set_style_str(label1, "normal:font_name", "NotoSansSC_Regular");
  widget_set_style_int(label1, "normal:font_size", 32);
  widget_set_style_color(label1, "normal:text_color", 0xffffffff);
  widget_set_text_utf8(label1, "靠近亮屏");

  widget_t* sensibility = label_create(win, 144, 200, 192, 64);
  widget_set_name(sensibility, "sensibility");
  widget_set_style_str(sensibility, "normal:text_align_h", "center");
  widget_set_style_str(sensibility, "normal:text_align_v", "middle");
  widget_set_style_str(sensibility, "normal:font_name", "COLMO-Mono-Regular");
  widget_set_style_int(sensibility, "normal:font_size", 64);
  widget_set_style_color(sensibility, "normal:text_color", 0xffffffff);
  widget_set_text_utf8(sensibility, "已关闭");

  widget_t* power_button = check_button_create(win, 204, 392, 72, 73);
  widget_set_name(power_button, "power_button");
  widget_set_style_str(power_button, "normal:text_align_h", "center");
  widget_set_style_str(power_button, "normal:text_align_v", "middle");
  widget_set_style_str(power_button, "normal:font_name", "icomoon");
  widget_set_style_int(power_button, "normal:font_size", 72);
  widget_set_style_color(power_button, "normal:text_color", 0x66ffffff);

  widget_set_style_str(power_button, "over:text_align_h", "center");
  widget_set_style_str(power_button, "over:text_align_v", "middle");
  widget_set_style_str(power_button, "over:font_name", "icomoon");
  widget_set_style_int(power_button, "over:font_size", 72);
  widget_set_style_color(power_button, "over:text_color", 0x66ffffff);

  widget_set_style_str(power_button, "pressed:text_align_h", "center");
  widget_set_style_str(power_button, "pressed:text_align_v", "middle");
  widget_set_style_str(power_button, "pressed:font_name", "icomoon");
  widget_set_style_int(power_button, "pressed:font_size", 72);
  widget_set_style_color(power_button, "pressed:text_color", 0x66ffffff);

  widget_set_style_str(power_button, "normal_of_checked:text_align_h", "center");
  widget_set_style_str(power_button, "normal_of_checked:text_align_v", "middle");
  widget_set_style_str(power_button, "normal_of_checked:font_name", "icomoon");
  widget_set_style_int(power_button, "normal_of_checked:font_size", 72);
  widget_set_style_color(power_button, "normal_of_checked:text_color", 0xffffffff);

  widget_set_style_str(power_button, "over_of_checked:text_align_h", "center");
  widget_set_style_str(power_button, "over_of_checked:text_align_v", "middle");
  widget_set_style_str(power_button, "over_of_checked:font_name", "icomoon");
  widget_set_style_int(power_button, "over_of_checked:font_size", 72);
  widget_set_style_color(power_button, "over_of_checked:text_color", 0xffffffff);

  widget_set_style_str(power_button, "pressed_of_checked:text_align_h", "center");
  widget_set_style_str(power_button, "pressed_of_checked:text_align_v", "middle");
  widget_set_style_str(power_button, "pressed_of_checked:font_name", "icomoon");
  widget_set_style_int(power_button, "pressed_of_checked:font_size", 72);
  widget_set_style_color(power_button, "pressed_of_checked:text_color", 0xffffffff);

  widget_set_text_utf8(power_button, ui_icon_power_switch);

  widget_on(power_button, EVT_VALUE_CHANGED, on_changed, win);
  widget_on(back, EVT_CLICK, on_back, win);


  check_button_set_value(power_button, (bool_t)(data->human_sense));
  if (data->human_sense != 0) {
    widget_set_enable(prog, TRUE);
  } else {
    widget_set_enable(prog, FALSE);
  }

  int min = widget_get_prop_int(prog, SLIDER_CIRCLE_PROP_MIN, 0);
  int max = widget_get_prop_int(prog, SLIDER_CIRCLE_PROP_MAX, 0);
  if (data->proximity_gear == 0) {
    widget_set_value(prog, (float_t)(min));
  }
  else if (data->proximity_gear == 1) {
    widget_set_value(prog, (float_t)(0.5f * (max - min) + min));
  }
  else if (data->proximity_gear == 2) {
    widget_set_value(prog, (float_t)(max));
  }
  
  return RET_OK;
}

/**
 * 初始化窗口
 */
ret_t setting_proximity_wake_up_page_init(widget_t* win, void* ctx) {
  (void)ctx;
  return_value_if_fail(win != NULL, RET_BAD_PARAMS);

  ui_cache_data_t* ui_cache_data = setting_get_ui_cache_data();
  init_setting_proximity_wake_up_page(win, ui_cache_data);

  return RET_OK;
}

所在房间

效果预览

思路

  1. 创建 所在房间 视图

    widget_t* view = view_create(win, 32, 120, 416, 272);
    
  2. 加载 所在房间 视图

    ui_load_locate_room_view(view, (void*)&view_data, 3, 2, 16);
    
  3. 组装 所在房间 数据

    static ui_item_data_t view_item_data[6] = {
      [0] = {
        .text = "客厅",
      },
      [1] = {
        .text = "卧室",
      },
      [2] = {
        .text = "厨房",
      },
      [3] = {
        .text = "阳台",
        .next_win = "setting_locate_room_start_match_page",
      },
      [4] = {
        .text = "次卧",
      },
      [5] = {
        .text = "餐厅",
      },
    };
    
    static ui_component_data_t view_data = {
      .item_data = view_item_data,
      .size = 6,
    };
    

实现

/* 
	所在房间 
	src/pages/setting/setting_locate_room_page.c
*/
#include "awtk.h"
#include "../../common/navigator.h"
#include "../../common/ui_widget.h"
#include "../../common/ui_page_load.h"
#include "../../common/ui_cache_data.h"
#include "../../common/ui_font_icon.h"

#include "scroll_view/list_view.h"
#include "scroll_view/scroll_bar.h"
#include "scroll_view/scroll_view.h"

#include "ui_colmo_knob_common.h"

static ui_item_data_t view_item_data[6] = {
  [0] = {
    .text = "客厅",
  },
  [1] = {
    .text = "卧室",
  },
  [2] = {
    .text = "厨房",
  },
  [3] = {
    .text = "阳台",
    .next_win = "setting_locate_room_start_match_page",
  },
  [4] = {
    .text = "次卧",
  },
  [5] = {
    .text = "餐厅",
  },
};

static ui_component_data_t view_data = {
  .item_data = view_item_data,
  .size = 6,
};

static ret_t on_button(void* ctx, event_t* e) {
  return navigator_back();
}

static ret_t on_back(void* ctx, event_t* e) {
  navigator_back();
  return RET_OK;
}

/* 初始化主页面 */
static ret_t init_setting_locate_room_page(widget_t* win) {
  widget_set_style_color(win, "normal:bg_color", 0xff000000);

  /* 窗体动画 */
  widget_set_prop_str(win, WIDGET_PROP_ANIM_HINT, "htranslate(duration=500,easing=cubic_out)");

  widget_t* back = button_create(win, 136, 54, 40, 40);
  widget_set_text_utf8(back, ui_icon_back_image_font);
  widget_set_style_str(back, "normal:font_name", "icomoon");
  widget_set_style_int(back, "normal:font_size", 40);
  widget_set_style_color(back, "normal:text_color", 0x66ffffff);
  widget_set_style_str(back, "over:font_name", "icomoon");
  widget_set_style_int(back, "over:font_size", 40);
  widget_set_style_color(back, "over:text_color", 0x66ffffff);
  widget_set_style_str(back, "pressed:font_name", "icomoon");
  widget_set_style_int(back, "pressed:font_size", 40);
  widget_set_style_color(back, "pressed:text_color", 0x66ffffff);
  widget_on(back, EVT_CLICK, on_back, win);

  widget_t* button = button_create(win, 176, 56, 128, 32);
  widget_set_style_str(button, "normal:text_align_h", "center");
  widget_set_style_str(button, "normal:text_align_v", "middle");
  widget_set_style_str(button, "normal:font_name", "NotoSansSC_Regular");
  widget_set_style_int(button, "normal:font_size", 32);
  widget_set_style_color(button, "normal:text_color", 0xffffffff);
  
  widget_set_style_str(button, "over:text_align_h", "center");
  widget_set_style_str(button, "over:text_align_v", "middle");
  widget_set_style_str(button, "over:font_name", "NotoSansSC_Regular");
  widget_set_style_int(button, "over:font_size", 32);
  widget_set_style_color(button, "over:text_color", 0xffffffff);

  widget_set_style_str(button, "pressed:text_align_h", "center");
  widget_set_style_str(button, "pressed:text_align_v", "middle");
  widget_set_style_str(button, "pressed:font_name", "NotoSansSC_Regular");
  widget_set_style_int(button, "pressed:font_size", 32);
  widget_set_style_color(button, "pressed:text_color", 0xffffffff);

  widget_set_text_utf8(button, "所在房间");

  widget_on(button, EVT_CLICK, on_button, button);

  widget_t* view = view_create(win, 32, 120, 416, 272);

  ui_load_locate_room_view(view, (void*)&view_data, 3, 2, 16);

  return RET_OK;
}

/**
 * 初始化窗口的子控件
 */
static ret_t visit_init_child(void* ctx, const void* iter) {
  widget_t* win = WIDGET(ctx);
  widget_t* widget = WIDGET(iter);
  const char* name = widget->name;

  // 初始化指定名称的控件(设置属性或注册事件),请保证控件名称在窗口上唯一
  if (name != NULL && *name != '\0') {

  }

  return RET_OK;
}

/* 去初始化主页面 */
static ret_t deinit_setting_page(void* ctx, event_t* e) {
  return RET_OK;
}

static void setting_locate_room_page_event_regist(widget_t* win) {
  // widget_on(win, EVT_WINDOW_CLOSE, deinit_setting_page, win);
}

/**
 * 初始化窗口
 */
ret_t setting_locate_room_page_init(widget_t* win, void* ctx) {
  (void)ctx;
  return_value_if_fail(win != NULL, RET_BAD_PARAMS);

  init_setting_locate_room_page(win);

  /* 初始化每一个子控件 */
  // widget_foreach(win, visit_init_child, win);

  setting_locate_room_page_event_regist(win);

  return RET_OK;
}

/* 
	开始匹配
	src/pages/setting/setting_locate_room_start_match.c
*/

#include "awtk.h"
#include "../../common/navigator.h"
#include "../../common/ui_widget.h"
#include "../../common/ui_page_load.h"
#include "../../common/ui_cache_data.h"
#include "../../common/ui_font_icon.h"

#include "scroll_view/list_view.h"
#include "scroll_view/scroll_bar.h"
#include "scroll_view/scroll_view.h"

#include "ui_colmo_knob_common.h"

static ret_t on_button(void* ctx, event_t* e) {
  return navigator_back();
}

static ret_t on_back(void* ctx, event_t* e) {
  navigator_back();
  return RET_OK;
}

/* 初始化主页面 */
static ret_t init_setting_locate_room_start_match_page(widget_t* win) {
  widget_set_style_color(win, "normal:bg_color", 0xff000000);

  /* 窗体动画 */
  widget_set_prop_str(win, WIDGET_PROP_ANIM_HINT, "htranslate(duration=500,easing=cubic_out)");

  widget_t* back = button_create(win, 152, 54, 40, 40);
  widget_set_text_utf8(back, ui_icon_back_image_font);
  widget_set_style_str(back, "normal:font_name", "icomoon");
  widget_set_style_int(back, "normal:font_size", 40);
  widget_set_style_color(back, "normal:text_color", 0x66ffffff);
  widget_set_style_str(back, "over:font_name", "icomoon");
  widget_set_style_int(back, "over:font_size", 40);
  widget_set_style_color(back, "over:text_color", 0x66ffffff);
  widget_set_style_str(back, "pressed:font_name", "icomoon");
  widget_set_style_int(back, "pressed:font_size", 40);
  widget_set_style_color(back, "pressed:text_color", 0x66ffffff);
  widget_on(back, EVT_CLICK, on_back, win);

  widget_t* button = button_create(win, 192, 56, 96, 32);
  widget_set_style_str(button, "normal:font_name", "NotoSansSC_Regular");
  widget_set_style_int(button, "normal:font_size", 32);
  widget_set_style_color(button, "normal:text_color", 0xffffffff);
  widget_set_style_str(button, "over:font_name", "NotoSansSC_Regular");
  widget_set_style_int(button, "over:font_size", 32);
  widget_set_style_color(button, "over:text_color", 0xffffffff);
  widget_set_style_str(button, "pressed:font_name", "NotoSansSC_Regular");
  widget_set_style_int(button, "pressed:font_size", 32);
  widget_set_style_color(button, "pressed:text_color", 0xffffffff);
  widget_set_text_utf8(button, "上一步");

  widget_on(button, EVT_CLICK, on_button, button);

  widget_t* view = view_create(win, 210, 152, 60, 8);
  widget_set_style_color(view, "normal:bg_color", 0xff466ae6);

  widget_t* label = label_create(win, 96, 184, 288, 96);
  widget_set_style_str(label, "normal:text_align_h", "center");
  widget_set_style_str(label, "normal:text_align_v", "middle");
  widget_set_style_str(label, "normal:font_name", "NotoSansSC_Regular");
  widget_set_style_int(label, "normal:font_size", 36);
  widget_set_style_color(label, "normal:text_color", 0xffffffff);
  widget_set_text_utf8(label, "将为您匹配新房间常用功能");
  label_set_line_wrap(label, TRUE);

  widget_t* button2 = button_create(win, 124, 304, 232, 80);
  widget_set_style_color(button2, "normal:bg_color", 0xff1f1f1f);
  widget_set_style_color(button2, "normal:text_color", 0xb2ffffff);
#if !defined(AWTK_NOT_ROUND_RADIUS)
  widget_set_style_int(button2, "normal:round_radius", 40);
#endif
  widget_set_style_str(button2, "normal:font_name", "NotoSansSC_Regular");
  widget_set_style_int(button2, "normal:font_size", 28);

  widget_set_style_color(button2, "pressed:bg_color", 0xff466ae6);
  widget_set_style_color(button2, "pressed:text_color", 0xffffffff);
#if !defined(AWTK_NOT_ROUND_RADIUS)
  widget_set_style_int(button2, "pressed:round_radius", 40);
#endif
  widget_set_style_str(button2, "pressed:font_name", "NotoSansSC_Regular");
  widget_set_style_int(button2, "pressed:font_size", 28);

  widget_set_style_color(button2, "over:bg_color", 0xff1f1f1f);
  widget_set_style_color(button2, "over:text_color", 0xb2ffffff);
#if !defined(AWTK_NOT_ROUND_RADIUS)
  widget_set_style_int(button2, "over:round_radius", 40);
#endif
  widget_set_style_str(button2, "over:font_name", "NotoSansSC_Regular");
  widget_set_style_int(button2, "over:font_size", 28);

  widget_set_text_utf8(button2, "开始匹配");

  return RET_OK;
}

/**
 * 初始化窗口
 */
ret_t setting_locate_room_start_match_page_init(widget_t* win, void* ctx) {
  (void)ctx;
  return_value_if_fail(win != NULL, RET_BAD_PARAMS);

  init_setting_locate_room_start_match_page(win);

  return RET_OK;
}

关于本机

效果预览

思路

  1. 创建 关于本机 滑动视图

      widget_t* list_view = list_view_create(win, 32, 120, 416, 360);
      widget_t* scroll_bar = scroll_bar_create_mobile(list_view, 0, 0, 0, 0);
      widget_t* scroll_view = scroll_view_create(list_view, 0, 0, 416, 360);
    
      widget_t* view = view_create(scroll_view, 0, 0, 416, 436);
    
  2. 加载 关于本机 滑动视图

      ui_load_about_this_machine_list(view, (void*)&setting_list_data);
    
  3. 组装 关于本机 数据

    static ui_item_data_t about_this_machine_item_data[7] = {
      [0] = {
        .text = "设备型号",
        .text2 = "XL20240454",
      },
      [1] = {
        .text = "WiFi地址",
        .text2 = "Midea",
      },
      [2] = {
        .text = "WiFi强度",
        .text2 = "优(-20dm)",
      },
      [3] = {
        .text = "IP地址",
        .text2 = "192.168.1.1",
      },
      [4] = {
        .text = "MAC地址",
        .text2 = "ea:02:aa:04:dd:ee",
      },
      [5] = {
        .text = "固件版本",
        .text2 = "1.2",
      },
      [6] = {
        .text = "应用版本",
        .text2 = "1.0",
      },
    };
    
    static ui_component_data_t setting_list_data = {
      .item_data = about_this_machine_item_data,
      .size = 7,
    };
    
  4. 恢复出厂

    static ret_t on_button_reset(void* ctx, event_t* e) { 
      ui_clean_all_data_cache(); 
      ui_factory_reset_callbacks();  
      navigator_to_with_context("boot_animation_page",NULL,true);
      return RET_OK;
    }
    
  5. 重启

实现

/*
	关于本机
	src/pages/setting/setting_about_this_machine_page.c
 */

#include "awtk.h"
#include "../../common/navigator.h"
#include "../../common/ui_widget.h"
#include "../../common/ui_page_load.h"
#include "../../common/ui_cache_data.h"
#include "../../common/ui_font_icon.h"
#include "../../service/ui_setting_service.h"

#include "scroll_view/list_view.h"
#include "scroll_view/scroll_bar.h"
#include "scroll_view/scroll_view.h"

#include "ui_colmo_knob_common.h"

static ui_item_data_t about_this_machine_item_data[7] = {
  [0] = {
    .text = "设备型号",
    .text2 = "XL20240454",
  },
  [1] = {
    .text = "WiFi地址",
    .text2 = "Midea",
  },
  [2] = {
    .text = "WiFi强度",
    .text2 = "优(-20dm)",
  },
  [3] = {
    .text = "IP地址",
    .text2 = "192.168.1.1",
  },
  [4] = {
    .text = "MAC地址",
    .text2 = "ea:02:aa:04:dd:ee",
  },
  [5] = {
    .text = "固件版本",
    .text2 = "1.2",
  },
  [6] = {
    .text = "应用版本",
    .text2 = "1.0",
  },
};

static ui_component_data_t setting_list_data = {
  .item_data = about_this_machine_item_data,
  .size = 7,
};

static ret_t on_button(void* ctx, event_t* e) {
  return navigator_back();
}

static ret_t on_button_reset(void* ctx, event_t* e) { 
  ui_clean_all_data_cache(); 
  ui_factory_reset_callbacks();  
  navigator_to_with_context("boot_animation_page",NULL,true);
  return RET_OK;
}


static ret_t on_back(void* ctx, event_t* e) {
  navigator_back();
  return RET_OK;
}

/* 初始化主页面 */
static ret_t init_setting_about_this_machine_page(widget_t* win) {
  widget_set_style_color(win, "normal:bg_color", 0xff000000);

  /* 窗体动画 */
  widget_set_prop_str(win, WIDGET_PROP_ANIM_HINT, "htranslate(duration=500,easing=cubic_out)");

  widget_t* back = button_create(win, 136, 54, 40, 40);
  widget_set_text_utf8(back, ui_icon_back_image_font);
  widget_set_style_str(back, "normal:font_name", "icomoon");
  widget_set_style_int(back, "normal:font_size", 40);
  widget_set_style_color(back, "normal:text_color", 0x66ffffff);
  widget_set_style_str(back, "over:font_name", "icomoon");
  widget_set_style_int(back, "over:font_size", 40);
  widget_set_style_color(back, "over:text_color", 0x66ffffff);
  widget_set_style_str(back, "pressed:font_name", "icomoon");
  widget_set_style_int(back, "pressed:font_size", 40);
  widget_set_style_color(back, "pressed:text_color", 0x66ffffff);
  widget_on(back, EVT_CLICK, on_back, win);

  widget_t* button = button_create(win, 176, 56, 128, 32);
  widget_set_style_str(button, "normal:text_align_h", "center");
  widget_set_style_str(button, "normal:text_align_v", "middle");
  widget_set_style_str(button, "normal:font_name", "NotoSansSC_Regular");
  widget_set_style_int(button, "normal:font_size", 32);
  widget_set_style_color(button, "normal:text_color", 0xffffffff);
  
  widget_set_style_str(button, "over:text_align_h", "center");
  widget_set_style_str(button, "over:text_align_v", "middle");
  widget_set_style_str(button, "over:font_name", "NotoSansSC_Regular");
  widget_set_style_int(button, "over:font_size", 32);
  widget_set_style_color(button, "over:text_color", 0xffffffff);

  widget_set_style_str(button, "pressed:text_align_h", "center");
  widget_set_style_str(button, "pressed:text_align_v", "middle");
  widget_set_style_str(button, "pressed:font_name", "NotoSansSC_Regular");
  widget_set_style_int(button, "pressed:font_size", 32);
  widget_set_style_color(button, "pressed:text_color", 0xffffffff);

  widget_set_text_utf8(button, "关于本机");
  widget_on(button, EVT_CLICK, on_button, button);


  widget_t* list_view = list_view_create(win, 32, 120, 416, 360);
  widget_t* scroll_bar = scroll_bar_create_mobile(list_view, 0, 0, 0, 0);
  widget_t* scroll_view = scroll_view_create(list_view, 0, 0, 416, 360);

  widget_t* view = view_create(scroll_view, 0, 0, 416, 436);
  widget_set_style_color(view, "normal:bg_color", 0x1fffffff);
#if !defined(AWTK_NOT_ROUND_RADIUS)
  widget_set_style_int(view, "normal:round_radius", 32);
#endif
  ui_load_about_this_machine_list(view, (void*)&setting_list_data);


  widget_t* button2 = button_create(scroll_view, 32, 232, 416, 80);
  widget_set_style_str(button2, "normal:font_name", "NotoSansSC_Regular");
  widget_set_style_int(button2, "normal:font_size", 28);
  widget_set_style_color(button2, "normal:text_color", 0xffffffff);
  widget_set_style_color(button2, "normal:bg_color", 0x1fffffff);
#if !defined(AWTK_NOT_ROUND_RADIUS)
  widget_set_style_int(button2, "normal:round_radius", 40);
#endif
  widget_set_style_str(button2, "over:font_name", "NotoSansSC_Regular");
  widget_set_style_int(button2, "over:font_size", 28);
  widget_set_style_color(button2, "over:text_color", 0xffffffff);
  widget_set_style_color(button2, "over:bg_color", 0x1fffffff);
#if !defined(AWTK_NOT_ROUND_RADIUS)
  widget_set_style_int(button2, "over:round_radius", 40);
#endif
  widget_set_style_str(button2, "pressed:font_name", "NotoSansSC_Regular");
  widget_set_style_int(button2, "pressed:font_size", 28);
  widget_set_style_color(button2, "pressed:text_color", 0xff466ae6);
  widget_set_style_color(button2, "pressed:bg_color", 0x1fffffff);
#if !defined(AWTK_NOT_ROUND_RADIUS)
  widget_set_style_int(button2, "pressed:round_radius", 40);
#endif
  widget_set_text_utf8(button2, "恢复出厂设置");
  widget_on(button2, EVT_CLICK, on_button_reset, button2);


  widget_t* button3 = button_create(scroll_view, 32, 232, 416, 80);
  widget_set_style_str(button3, "normal:font_name", "NotoSansSC_Regular");
  widget_set_style_int(button3, "normal:font_size", 28);
  widget_set_style_color(button3, "normal:text_color", 0xffffffff);
  widget_set_style_color(button3, "normal:bg_color", 0x1fffffff);
#if !defined(AWTK_NOT_ROUND_RADIUS)
  widget_set_style_int(button3, "normal:round_radius", 40);
#endif
  widget_set_style_str(button3, "over:font_name", "NotoSansSC_Regular");
  widget_set_style_int(button3, "over:font_size", 28);
  widget_set_style_color(button3, "over:text_color", 0xffffffff);
  widget_set_style_color(button3, "over:bg_color", 0x1fffffff);
#if !defined(AWTK_NOT_ROUND_RADIUS)
  widget_set_style_int(button3, "over:round_radius", 40);
#endif
  widget_set_style_str(button3, "pressed:font_name", "NotoSansSC_Regular");
  widget_set_style_int(button3, "pressed:font_size", 28);
  widget_set_style_color(button3, "pressed:text_color", 0xff466ae6);
  widget_set_style_color(button3, "pressed:bg_color", 0x1fffffff);
#if !defined(AWTK_NOT_ROUND_RADIUS)
  widget_set_style_int(button3, "pressed:round_radius", 40);
#endif
  widget_set_text_utf8(button3, "重启");
  // widget_on(button3, EVT_CLICK, on_button, button3);

  widget_set_children_layout(scroll_view, "list_view(s=16)");

  return RET_OK;
}

/**
 * 初始化窗口
 */
ret_t setting_about_this_machine_page_init(widget_t* win, void* ctx) {
  (void)ctx;
  return_value_if_fail(win != NULL, RET_BAD_PARAMS);

  init_setting_about_this_machine_page(win);

  return RET_OK;
}

posted on 2024-11-22 15:25  AtlasLapetos  阅读(67)  评论(0)    收藏  举报