使用JavaScript在HaaS EDU K1上实现文字显示

Posted HaaS技术社区

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了使用JavaScript在HaaS EDU K1上实现文字显示相关的知识,希望对你有一定的参考价值。

 

1、前言

当前HaaS EDU K1已经支持通过JS轻应用方式进行开发调试了,这块开发板带着OLED屏,而底层的Alios Things已经支持图形库,所以可以通过轻应用的开发方式,尝试进行GUI相应的开发。

2、下载代码及环境准备

2.1、下载代码

从以下地方下载AliOS3.3版本代码:

  • Gitee: https://gitee.com/alios-things
  • Github: https://github.com/alibaba/AliOS-Things
  • Code China: https://codechina.csdn.net/alios-things/AliOS-Things

2.2、代码配置

在solutions/amp_demo/package.yaml中,对AMP_ADVANCED_ADDON_UI进行配置,配置如下:

   AMP_ADVANCED_ADDON_UI: 1

2.3、添加轻应用代码

在solutions/javascript_demo/board/haas-edu-k1目录里面,有轻应用的示例代码:

入口文件app.json

{
    "version": "1.0.0",
    "io": {
        "KEY1": {
            "type": "GPIO",
            "port": 23,
            "dir": "irq",
            "pull": "pullup",
            "intMode":"falling"
        },

        "KEY2": {
            "type": "GPIO",
            "port": 20,
            "dir": "irq",
            "pull": "pullup",
            "intMode":"falling"
        },

        "KEY3": {
            "type": "GPIO",
            "port": 21,
            "dir": "irq",
            "pull": "pullup",
            "intMode":"falling"
        },

        "KEY4": {
            "type": "GPIO",
            "port": 26,
            "dir": "irq",
            "pull": "pullup",
            "intMode":"falling"

        },

        "L1":{
            "type":"GPIO",
            "port":36,
            "dir":"output",
            "pull":"pulldown"
        },

        "L2":{
            "type":"GPIO",
            "port":35,
            "dir":"output",
            "pull":"pulldown"
        },

        "L3":{
            "type":"GPIO",
            "port":34,
            "dir":"output",
            "pull":"pulldown"
        },

        "P04":{
            "type":"GPIO",
            "port":4,
            "dir":"output",
            "pull":"pulldown"
        },

        "P05":{
            "type":"GPIO",
            "port":5,
            "dir":"output",
            "pull":"pulldown"
        },

        "P06":{
            "type":"GPIO",
            "port":6,
            "dir":"output",
            "pull":"pulldown"
        },

        "P07":{
            "type":"GPIO",
            "port":7,
            "dir":"output",
            "pull":"pulldown"
        },

        "oled_dc": {
            "type": "GPIO",
            "port": 28,
            "dir": "output",
            "pull": "pulldown"
        },

        "oled_res": {
            "type": "GPIO",
            "port": 30,
            "dir": "output",
            "pull": "pulldown"
        },

        "oled_spi": {
            "type": "SPI",
            "port": 1,
            "mode": "mode3",
            "freq": 26000000
        },

        "SPI0":{
            "type": "SPI",
            "port": 0,
            "mode": "mode1",
            "freq": 26000000
        },

        "serial": {

            "type": "UART",

            "port": 2,

            "dataWidth": 8,

            "baudRate": 115200,

            "stopBits": 1,

            "flowControl": "disable",

            "parity": "none"

        },

        "sensor": {

            "type": "I2C",

            "port": 1,

            "addrWidth": 7,

            "freq": 400000,

            "mode": "master",

            "devAddr": 64

        },

        "ADC0":{

            "type": "ADC",

            "port": 0,

            "sampling": 12000000

        },

        "ADC1":{

            "type": "ADC",

            "port": 1,

            "sampling": 12000000

        },

        "ADC2":{

            "type": "ADC",

            "port": 2,

            "sampling": 12000000

        },

        "pwm1": {

            "type": "PWM",

            "port": 1

        },

        "PWM2":{

            "type":"PWM",

            "port":2

        },

        "PWM3":{

            "type":"PWM",

            "port":3

        },

        "timer1": {

            "type": "TIMER",

            "port": 1

        }

    },



    "pages": [

        "data/jsamp/uipages/page/waring"

    ],



    "debugLevel": "DEBUG",

    "repl":"enable"

}



{

    "version": "1.0.0",

    "io": {

        "KEY1": {

            "type": "GPIO",

            "port": 23,

            "dir": "irq",

            "pull": "pullup",

            "intMode":"falling"

        },

        "KEY2": {

            "type": "GPIO",

            "port": 20,

            "dir": "irq",

            "pull": "pullup",

            "intMode":"falling"

        },

        "KEY3": {

            "type": "GPIO",

            "port": 21,

            "dir": "irq",

            "pull": "pullup",

            "intMode":"falling"

        },

        "KEY4": {

            "type": "GPIO",

            "port": 26,

            "dir": "irq",

            "pull": "pullup",

            "intMode":"falling"

        },

        "L1":{

            "type":"GPIO",

            "port":36,

            "dir":"output",

            "pull":"pulldown"

        },

        "L2":{

            "type":"GPIO",

            "port":35,

            "dir":"output",

            "pull":"pulldown"

        },

        "L3":{

            "type":"GPIO",

            "port":34,

            "dir":"output",

            "pull":"pulldown"

        },

        "P04":{

            "type":"GPIO",

            "port":4,

            "dir":"output",

            "pull":"pulldown"

        },

        "P05":{

            "type":"GPIO",

            "port":5,

            "dir":"output",

            "pull":"pulldown"

        },

        "P06":{

            "type":"GPIO",

            "port":6,

            "dir":"output",

            "pull":"pulldown"

        },

        "P07":{

            "type":"GPIO",

            "port":7,

            "dir":"output",

            "pull":"pulldown"

        },

        "oled_dc": {

            "type": "GPIO",

            "port": 28,

            "dir": "output",

            "pull": "pulldown"

        },

        "oled_res": {

            "type": "GPIO",

            "port": 30,

            "dir": "output",

            "pull": "pulldown"

        },

        "oled_spi": {

            "type": "SPI",

            "port": 1,

            "mode": "mode3",

            "freq": 26000000

        },

        "SPI0":{

            "type": "SPI",

            "port": 0,

            "mode": "mode1",

            "freq": 26000000

        },

        "serial": {

            "type": "UART",

            "port": 2,

            "dataWidth": 8,

            "baudRate": 115200,

            "stopBits": 1,

            "flowControl": "disable",

            "parity": "none"

        },

        "sensor": {

            "type": "I2C",

            "port": 1,

            "addrWidth": 7,

            "freq": 400000,

            "mode": "master",

            "devAddr": 64

        },

        "ADC0":{

            "type": "ADC",

            "port": 0,

            "sampling": 12000000

        },

        "ADC1":{

            "type": "ADC",

            "port": 1,

            "sampling": 12000000

        },

        "ADC2":{

            "type": "ADC",

            "port": 2,

            "sampling": 12000000

        },

        "pwm1": {

            "type": "PWM",

            "port": 1

        },

        "PWM2":{

            "type":"PWM",

            "port":2

        },

        "PWM3":{

            "type":"PWM",

            "port":3

        },

        "timer1": {

            "type": "TIMER",

            "port": 1

        }

    },



    "pages": [

        "data/jsamp/uipages/page/waring"

    ],



    "debugLevel": "DEBUG",

    "repl":"enable"

}

在solutions/javascript_demo/board/haas-edu-k1/uipages/page目录里面,有轻应用的界面显示示例代码:

waring.css是配置文字的颜色,字号大小的样式示例

#waring {
  font-color: #ffffff;
  font-size: 16px;
}

waring.js是逻辑交互的示例代码,目前暂时没有特殊逻辑实现,只是一些打印

var ui = require('ui');
if (!(ui && ui.redirectTo)) {
    throw new Error("ui: [failed] require(\\'ui\\')");
}


Page({
  onShow: function() {
    console.log('enter page onShow');


  },


  onExit: function() {
    console.log('enter page onExit');


  },


  onUpdate: function() {
    console.log('enter page onUpdate');
  }


});

waring.xml是界面开发的示例代码,目前是想要显示文本“boss coming”

<?xml version="1.0" encoding="utf-8"?>


<page>
    <text id="waring" class="textClass" >boss coming</text>
</page>

2.4、 编译下载

*> 选择解决方案: “javascript_demo”*

*> 选择开发板: HaaS EDU K1*

– 参考 HaaS100_Quick_Start (3.1 编译工程章节),点击 ✅ 即可完成编译固件。

– 参考 HaaS100_Quick_Start (3.2 烧录镜像章节),点击 "⚡️" 即可完成烧录固件。
 

3、结果展示

开发者支持

如需更多技术支持,可加入钉钉开发者群,或者关注微信公众号。

更多技术与解决方案介绍,请访问HaaS官方网站https://haas.iot.aliyun.com

 

 

 

以上是关于使用JavaScript在HaaS EDU K1上实现文字显示的主要内容,如果未能解决你的问题,请参考以下文章

如何升级HaaS100 / HaaS EDU K1的二级boot

HaaS EDU K1快速开始

开发者案例使用HaaS EDU K1实现一个数字量角器

HaaS EDU K1 快速搭建Python开发环境

HaaS EDU K1场景式应用案例上手

HaaS轻应用(JavaScript)低功耗蓝牙案例