{ "layoutId": "simple_buttons_images", //界面模板ID "version": "1.0.0", //数据版本 "name": "Test 222222", //模板名称 "width": 1920, //模板设计宽度，必须严格填写，涉及绘制时按比例缩放 "height": 1080, //模板设计高度，必须严格填写，涉及绘制时按比例缩放 "focusConfig": { "defaultFocusId": "btn_home" //界面绘制完成后，第一个获得焦点的组件ID }, "rootView": { "id": "root_container", //组件ID "type": "LinearLayout", //组件类型 "x": 0, //x轴坐标，暂时用不到。在AbsoluteLayout里才会用到 "y": 0, //y轴坐标，暂时用不到。在AbsoluteLayout里才会用到 "leftMargin": 0, //向左边距 "topMargin": 0, //向上边距 "rightMargin": 0, //向右边距 "bottomMargin": 0, //向下边距 "width": -1, //MATCH_PARENT = -1; WRAP_CONTENT = -2;，其他>=0则按数据绘制实际大小 "height": -1, //MATCH_PARENT = -1; WRAP_CONTENT = -2;，其他>=0则按数据绘制实际大小 "orientation": 1, //LinearLayout 特有属性，HORIZONTAL=0，VERTICAL=1 "background": { //所有background，不管在那一层均可设置如下属性 "color": "#FFFFFF", //背景颜色 "imageUrl": "", //背景图片 "cornerRadius": { //圆角 "topLeft": 8, //上左圆角 "topRight": 8, //上右圆角 "bottomLeft": 8, //下左圆角 "bottomRight": 8 //下右圆角 }, "border": { //边框 "width": 2, //边框线宽 "color": "#1976D2" //边框颜色 } }, "children": [ { "id": "header",//组件ID "type": "LinearLayout",//组件类型 "x": 0, "y": 10, "leftMargin": 0, "topMargin": 0, "rightMargin": 0, "bottomMargin": 0, "width": 1920, "height": 100, "orientation": 0,//LinearLayout 特有属性，HORIZONTAL=0，VERTICAL=1 "background": { "color": "#2196F3" }, "children": [ { "id": "title_text", "type": "TextView", "x": 0, "y": 20, "leftMargin": 0, "topMargin": 0, "rightMargin": 0, "bottomMargin": 0, "width": 1920, "height": 60, "text": "Test 33333333333333", //文本内容 "textSize": 24, //文字大小 "textColor": "#FFFFFF", //文字颜色 "bold": true, //是否加粗 "focusable": false //是否可获得焦点 } ] }, { "id": "main_content",//组件ID "type": "LinearLayout",//组件类型 "x": 0, "y": 80, "leftMargin": 0, "topMargin": 0, "rightMargin": 0, "bottomMargin": 0, "width": 1920, "height": -2, "orientation": 1, "background": { "color": "#FFFFFF" }, "children": [ { "id": "buttons_row",//组件ID "type": "LinearLayout",//组件类型 "x": 0, "y": 0, "leftMargin": 0, "topMargin": 40, "rightMargin": 0, "bottomMargin": 0, "width": 1920, "height": 100, "orientation": 0, "gravity": 17, //17：内容居中，48：内容居上，80：内容居下，3：内容居左，5：内容居右，（还有左上，右上，左下，右下） "background": { "color": "#673AB7" }, "children": [ { "id": "btn_home", "type": "LinearLayout", "x": 0, "y": 0, "leftMargin": 0, "topMargin": 0, "rightMargin": 0, "bottomMargin": 0, "width": 100, "height": 100, "orientation": 1, "gravity": 17, "focusable": true //是否可获得焦点，若设置了true，则优先该组件获取到焦点 "children": [ { "id": "btn_home1", "type": "TextView", "x": 0, "y": 0, "leftMargin": 0, "topMargin": 0, "rightMargin": 0, "bottomMargin": 0, "width": 100, "height": 40, "text": "首页", "gravity": 17, "textSize": 20, "textColor": "#29303f", "background": { "color": "#2196F3", "cornerRadius": { "topLeft": 8, "topRight": 8, "bottomLeft": 8, "bottomRight": 8 }, "border": { "width": 2, "color": "#1976D2" } } }, { "id": "image_nature1", "type": "ImageView", "x": 0, "y": 0, "leftMargin": 0, "topMargin": 0, "rightMargin": 0, "bottomMargin": 0, "width": 50, "height": 50, "imageUrl": "https://images.unsplash.com/photo-1501854140801-50d01698950b", //图片地址，可在线地址，也可本地文件名 "placeholder": "https://via.placeholder.com/400x400/CCCCCC/FFFFFF?text=Nature", //占位图片地址，可在线地址，也可本地文件名 "scaleType": "CENTER_CROP", // FIT_XY, FIT_CENTER, CENTER_CROP, CENTER_INSIDE "background": { "color": "#E0E0E0", "cornerRadius": { "topLeft": 12, "topRight": 12, "bottomLeft": 12, "bottomRight": 12 } } } ], "background": { "color": "#2196F3", "cornerRadius": { "topLeft": 8, "topRight": 8, "bottomLeft": 8, "bottomRight": 8 }, "border": { //边框 "width": 2, //边框线宽 "color": "#1976D2" //边框颜色 } }, "focusConfig": { //焦点配置 "upId": null, //遥控板操作下一个上移焦点ViewID "downId": "images_row",//遥控板操作下一个下移焦点ViewID "leftId": null, //遥控板操作下一个左移焦点ViewID "rightId": "btn_settings",//遥控板操作下一个右移焦点ViewID "focusable": true, //是否可获得焦点 "focusableInTouchMode": false, //在触摸模式下是否可获得焦点 "defaultFocus": true, //界面绘制完成后，是否第一个获得焦点 "focusedStyle": { //获得焦点时 "background": { "color": "#1976D2" //背景颜色 }, "border": { //边框 "width": 3, //边框线宽 "color": "#0D47A1" //边框颜色 }, "scale": 1.1, //缩放比例，动画默认300毫秒 "focusAnimation": "scale", //scale：缩放，pulse：脉冲（先放大，再缩小回原来大小） "animationDuration": 300 //动画持续时间，毫秒 }, }, "events": [ { "type": "click", "action": "custom", "params": { "message": "首页按钮被点击" } } ] }, { "id": "btn_settings",//组件ID "type": "TextView",//组件类型 "x": 0, "y": 0, "leftMargin": 40, "topMargin": 0, "rightMargin": 0, "bottomMargin": 0, "width": 200, "height": 80, "text": "设置", "gravity": 17, "textSize": 20, "textColor": "#29303f", "background": { "color": "#FF9800", "cornerRadius": { "topLeft": 8, "topRight": 8, "bottomLeft": 8, "bottomRight": 8 } }, "focusConfig": { "upId": null, "downId": "images_row", "leftId": "btn_home", "rightId": "btn_info", "focusable": true, "focusableInTouchMode": false, "focusedStyle": { "background": { "color": "#F57C00" }, "border": { "width": 3, "color": "#E65100" }, "scale": 1.1, "focusAnimation": "scale", //scale：缩放，pulse：脉冲（先放大，再缩小回原来大小） "animationDuration": 300 //动画持续时间，毫秒 } }, "events": [ //点击事件，定义跳转到哪里，可以定义APP内部功能或者网址 { "type": "click", "action": "custom", "params": { "message": "设置按钮被点击" } } ] }, { "id": "btn_info",//组件ID "type": "TextView",//组件类型 "x": 0, "y": 0, "leftMargin": 40, "topMargin": 0, "rightMargin": 0, "bottomMargin": 0, "width": 200, "height": 80, "text": "信息", "gravity": 17, "textSize": 20, "textColor": "#29303f", "background": { "color": "#4CAF50", "cornerRadius": { "topLeft": 8, "topRight": 8, "bottomLeft": 8, "bottomRight": 8 } }, "focusConfig": { "upId": null, "downId": "images_row", "leftId": "btn_settings", "rightId": "btn_help", "focusable": true, "focusableInTouchMode": false, "focusedStyle": { "background": { "color": "#388E3C" }, "border": { "width": 3, "color": "#1B5E20" }, "scale": 1.1, "focusAnimation": "scale", //scale：缩放，pulse：脉冲（先放大，再缩小回原来大小） "animationDuration": 300 //动画持续时间，毫秒 } }, "events": [ { "type": "click", "action": "custom", "params": { "message": "信息按钮被点击" } } ] }, { "id": "btn_help",//组件ID "type": "TextView",//组件类型 "x": 0, "y": 0, "leftMargin": 40, "topMargin": 0, "rightMargin": 0, "bottomMargin": 0, "width": 200, "height": 80, "text": "帮助", "gravity": 17, "textSize": 20, "textColor": "#29303f", "background": { "color": "#9C27B0", "cornerRadius": { "topLeft": 8, "topRight": 8, "bottomLeft": 8, "bottomRight": 8 } }, "focusConfig": { "upId": null, "downId": "images_row", "leftId": "btn_info", "rightId": null, "focusable": true, "focusableInTouchMode": false, "focusedStyle": { "background": { "color": "#7B1FA2" }, "border": { "width": 3, "color": "#4A148C" }, "scale": 1.1, "focusAnimation": "scale", //scale：缩放，pulse：脉冲（先放大，再缩小回原来大小） "animationDuration": 300 //动画持续时间，毫秒 } }, "events": [ { "type": "click", "action": "custom", "params": { "message": "帮助按钮被点击" } } ] } ] }, { "id": "images_row",//组件ID "type": "LinearLayout",//组件类型 "x": 0, "y": 0, "leftMargin": 0, "topMargin": 80, "rightMargin": 0, "bottomMargin": 0, "width": 1920, "height": 500, "orientation": 0, "gravity": 17, "background": { "color": "#FFFFFF" }, "children": [ { "id": "image_nature", "type": "ImageView", "x": 0, "y": 0, "leftMargin": 0, "topMargin": 0, "rightMargin": 0, "bottomMargin": 0, "width": 400, "height": 400, "imageUrl": "https://images.unsplash.com/photo-1501854140801-50d01698950b", "placeholder": "https://via.placeholder.com/400x400/CCCCCC/FFFFFF?text=Nature", "scaleType": "CENTER_CROP", "background": { "color": "#E0E0E0", "cornerRadius": { //圆角 "topLeft": 12, "topRight": 12, "bottomLeft": 12, "bottomRight": 12 } }, "shadow": {//阴影配置 "radius": 8, "offsetX": 0, "offsetY": 4, "color": "#20000000" }, "focusConfig": { "upId": "btn_home", "downId": null, "leftId": null, "rightId": "image_tech", "focusable": true, "focusableInTouchMode": false, "focusedStyle": { "background": { "color": "#BBDEFB" }, "border": { "width": 4, "color": "#2196F3" }, "scale": 1.05, "focusAnimation": "border", "animationDuration": 300 } }, "events": [ { "type": "click", "action": "custom", "params": { "message": "自然图片被点击", "imageId": "nature" } } ] }, { "id": "image_tech",//组件ID "type": "ImageView",//组件类型 "x": 0, "y": 0, "leftMargin": 80, "topMargin": 0, "rightMargin": 0, "bottomMargin": 0, "width": 400, "height": 400, "imageUrl": "https://images.unsplash.com/photo-1518709268805-4e9042af2176", "placeholder": "https://via.placeholder.com/400x400/CCCCCC/FFFFFF?text=Tech", "scaleType": "CENTER_CROP", "background": { "color": "#E0E0E0", "cornerRadius": { "topLeft": 12, "topRight": 12, "bottomLeft": 12, "bottomRight": 12 } }, "shadow": { "radius": 8, "offsetX": 0, "offsetY": 4, "color": "#20000000" }, "focusConfig": { "upId": "btn_settings", "downId": null, "leftId": "image_nature", "rightId": "image_food", "focusable": true, "focusableInTouchMode": false, "focusedStyle": { "background": { "color": "#FFECB3" }, "border": { "width": 4, "color": "#FF9800" }, "scale": 1.05, "focusAnimation": "border", "animationDuration": 300 } }, "events": [ { "type": "click", "action": "custom", "params": { "message": "科技图片被点击", "imageId": "tech" } } ] }, { "id": "image_food",//组件ID "type": "ImageView",//组件类型 "x": 0, "y": 0, "leftMargin": 80, "topMargin": 0, "rightMargin": 0, "bottomMargin": 0, "width": 400, "height": 400, "imageUrl": "https://images.unsplash.com/photo-1565958011703-44f9829ba187", "placeholder": "https://via.placeholder.com/400x400/CCCCCC/FFFFFF?text=Food", "scaleType": "CENTER_CROP", "background": { "color": "#E0E0E0", "cornerRadius": { "topLeft": 12, "topRight": 12, "bottomLeft": 12, "bottomRight": 12 } }, "shadow": { //阴影配置 "radius": 8, "offsetX": 0, "offsetY": 4, "color": "#20000000" }, "focusConfig": { "upId": "btn_info", "downId": null, "leftId": "image_tech", "rightId": "image_travel", "focusable": true, "focusableInTouchMode": false, "focusedStyle": { "background": { "color": "#C8E6C9" }, "border": { "width": 4, "color": "#4CAF50" }, "scale": 1.05, "focusAnimation": "pulse", "animationDuration": 300 } }, "events": [ { "type": "click", "action": "custom", "params": { "message": "美食图片被点击", "imageId": "food" } } ] }, { "id": "image_travel",//组件ID "type": "ImageView",//组件类型 "x": 0, "y": 0, "leftMargin": 80, "topMargin": 0, "rightMargin": 0, "bottomMargin": 0, "width": 400, "height": 400, "imageUrl": "https://images.unsplash.com/photo-1488646953014-85cb44e25828", "placeholder": "https://via.placeholder.com/400x400/CCCCCC/FFFFFF?text=Travel", "scaleType": "CENTER_CROP", "background": { "color": "#E0E0E0", "cornerRadius": { "topLeft": 12, "topRight": 12, "bottomLeft": 12, "bottomRight": 12 } }, "shadow": { "radius": 8, "offsetX": 0, "offsetY": 4, "color": "#20000000" }, "focusConfig": { "upId": "btn_help", "downId": null, "leftId": "image_food", "rightId": null, "focusable": true, "focusableInTouchMode": false, "focusedStyle": { "background": { "color": "#E1BEE7" }, "border": { "width": 4, "color": "#9C27B0" }, "scale": 1.05 } }, "events": [ { "type": "click", "action": "custom", "params": { "message": "旅行图片被点击", "imageId": "travel" } } ] } ] } ] }, { "id": "footer",//组件ID "type": "LinearLayout",//组件类型 "x": 0, "y": 0, "leftMargin": 0, "topMargin": 80, "rightMargin": 0, "bottomMargin": 0, "width": 1920, "height": 100, "orientation": 0, "gravity": 17, "background": { "color": "#263238" }, "children": [ { "id": "footer_text",//组件ID "type": "TextView",//组件类型 "x": 0, "y": 30, "leftMargin": 0, "topMargin": 0, "rightMargin": 0, "bottomMargin": 0, "width": 1920, "height": 40, "text": "Test 1111111", "textSize": 24, "textColor": "#B0BEC5", "gravity": 17, "focusable": false } ] } ] } }