This commit is contained in:
塩入孔章
2018-11-30 18:55:10 +08:00
18 changed files with 243 additions and 753 deletions
+4 -1
View File
@@ -2,4 +2,7 @@
[中文](/zh_CN/api_reference) | English | [日本語](/ja/api_reference)
- [LCD](/en/api_reference/api_lcd)
## [LCD](en/api_reference/api_lcd)
## [Peripherals](en/api_reference/peripherals/api_gpio)
### 1. [GPIO](en/api_reference/peripherals/api_gpio)
## [Speaker](en/api_reference/api_speaker)
+33 -247
View File
@@ -1,287 +1,73 @@
# LCD
### buildAllPlatforms
> StyleDictionary.buildAllPlatforms() ⇒ [<code>style-dictionary</code>](#module_style-dictionary)
The only top-level method that needs to be called
to build the Style Dictionary.
**Example**
```js
const StyleDictionary = require('style-dictionary').extend('config.json');
StyleDictionary.buildAllPlatforms();
```
* * *
### buildPlatform
> StyleDictionary.buildPlatform(platform) ⇒ [<code>style-dictionary</code>](#module_style-dictionary)
Takes a platform and performs all transforms to
the properties object (non-mutative) then
builds all the files and performs any actions. This is useful if you only want to
build the artifacts of one platform to speed up the build process.
This method is also used internally in [buildAllPlatforms](#buildAllPlatforms) to
build each platform defined in the config.
### <mark>setbrightness</mark>
> M5.Lcd.setbrightness(uint8_t brightness);
Set the brightness of LCD.
| Param | Type | Description |
| --- | --- | --- |
| platform | <code>String</code> | Name of the platform you want to build. |
| brightness | <code>uint8_t</code> | brightness(0-254) |
**Example**
```js
StyleDictionary.buildPlatform('web');
```
```bash
$ style-dictionary build --platform web
```c++
M5.Lcd.setbrightness(100);
```
* * *
### cleanAllPlatforms
> StyleDictionary.cleanAllPlatforms() ⇒ [<code>style-dictionary</code>](#module_style-dictionary)
Does the reverse of [buildAllPlatforms](#buildAllPlatforms) by
performing a clean on each platform. This removes all the files
defined in the platform and calls the undo method on any actions.
* * *
### cleanPlatform
> StyleDictionary.cleanPlatform(platform) ⇒ [<code>style-dictionary</code>](#module_style-dictionary)
Takes a platform and performs all transforms to
the properties object (non-mutative) then
cleans all the files and perfoms the undo method of any [actions](actions).
| Param | Type |
| --- | --- |
| platform | <code>String</code> |
* * *
### exportPlatform
> StyleDictionary.exportPlatform(platform) ⇒ <code>Object</code>
Exports a properties object with applied
platform transforms.
This is useful if you want to use a style
dictionary in JS build tools like webpack.
### <mark>fillScreen</mark>
> M5.Lcd.fillScreen(uint16_t color);
Set the color to display of the whole LCD.
| Param | Type | Description |
| --- | --- | --- |
| platform | <code>String</code> | The platform to be exported. Must be defined on the style dictionary. |
* * *
### extend
> StyleDictionary.extend(config) ⇒ [<code>style-dictionary</code>](#module_style-dictionary)
Create a Style Dictionary
| Param | Type | Description |
| --- | --- | --- |
| config | [<code>Config</code>](#Config) | Configuration options to build your style dictionary. If you pass a string, it will be used as a path to a JSON config file. You can also pass an object with the configuration. |
| color | <code>uint16_t</code> | color value |
**Example**
```js
const StyleDictionary = require('style-dictionary').extend('config.json');
const StyleDictionary = require('style-dictionary').extend({
source: ['properties/*.json'],
platforms: {
scss: {
transformGroup: 'scss',
buildPath: 'build/',
files: [{
destination: 'variables.scss',
format: 'scss/variables'
}]
}
// ...
}
});
```c++
M5.Lcd.fillScreen(RED);
delay(500);
M5.Lcd.fillScreen(WHITE);
delay(500);
```
* * *
### registerAction
> StyleDictionary.registerAction(action) ⇒ [<code>style-dictionary</code>](#module_style-dictionary)
Adds a custom action to the style property builder. Custom
actions can do whatever you need, such as: copying files,
base64'ing files, running other build scripts, etc.
After you register a custom action, you then use that
action in a platform your config.json
Actions run after the files in a platform are generated so you
can perform operations on files generated by the style dictionary.
Actions are run sequentially, if you write synchronous code then
it will block other actions, or if you use asynchronous code like Promises
it will not block.
### <mark>fillRect</mark>
> M5.Lcd.fillRect(int16_t x, int16_t y, int16_t w, int16_t h, uint16_t color);
Draw a filled rectangle.
| Param | Type | Description |
| --- | --- | --- |
| action | <code>Object</code> | |
| action.name | <code>String</code> | The name of the action |
| action.do | <code>function</code> | The action in the form of a function. |
| [action.undo] | <code>function</code> | A function that undoes the action. |
| x, y | <code>int16_t</code> | offset of x, y direction |
| w, h | <code>int16_t</code> | width and height of graphics |
| color | <code>uint16_t</code> | color to fill |
**Example**
```js
StyleDictionary.registerAction({
name: 'copy_assets',
do: function(dictionary, config) {
console.log('Copying assets directory');
fs.copySync('assets', config.buildPath + 'assets');
},
undo: function(dictionary, config) {
console.log('Cleaning assets directory');
fs.removeSync(config.buildPath + 'assets');
}
});
```c++
M5.Lcd.fillRect(50,50,60,150,WHITE);
```
* * *
### registerFormat
> StyleDictionary.registerFormat(format) ⇒ [<code>style-dictionary</code>](#module_style-dictionary)
Add a custom format to the style dictionary
### <mark>fillRoundRect</mark>
> M5.Lcd.fillRoundRect(int16_t x0, int16_t y0, int16_t w, int16_t h, int16_t radius, uint16_t color);
Draw a filled round rectangle.
| Param | Type | Description |
| --- | --- | --- |
| format | <code>Object</code> | |
| format.name | <code>String</code> | Name of the format to be referenced in your config.json |
| format.formatter | <code>function</code> | Function to perform the format. Takes 2 arguments, `dictionary` and `config` Must return a string. |
| x, y | <code>int16_t</code> | offset of x, y direction |
| w, h | <code>int16_t</code> | width and height of graphics |
| radius | <code>int16_t</code> | fillet radius |
| color | <code>uint16_t</code> | color to fill |
**Example**
```js
StyleDictionary.registerFormat({
name: 'json',
formatter: function(dictionary, config) {
return JSON.stringify(dictionary.properties, null, 2);
}
})
```c++
M5.Lcd.fillRoundRect(50,50,60,150,4,WHITE);
```
* * *
### registerTemplate
> StyleDictionary.registerTemplate(template) ⇒ [<code>style-dictionary</code>](#module_style-dictionary)
Add a custom template to the Style Dictionary
| Param | Type | Description |
| --- | --- | --- |
| template | <code>Object</code> | |
| template.name | <code>String</code> | The name of your template. You will refer to this in your config.json file. |
| template.template | <code>String</code> | Path to your lodash template |
**Example**
```js
StyleDictionary.registerTemplate({
name: 'Swift/colors',
template: __dirname + '/templates/swift/colors.template'
});
```
* * *
### registerTransform
> StyleDictionary.registerTransform(transform) ⇒ [<code>style-dictionary</code>](#module_style-dictionary)
Add a custom transform to the Style Dictionary
Transforms can manipulate a property's name, value, or attributes
| Param | Type | Description |
| --- | --- | --- |
| transform | <code>Object</code> | Transform object |
| transform.type | <code>String</code> | Type of transform, can be: name, attribute, or value |
| transform.name | <code>String</code> | Name of the transformer so a transformGroup can call a list of transforms. |
| [transform.matcher] | <code>function</code> | Matcher function, return boolean if transform should be applied. If you omit the matcher function, it will match all properties. |
| transform.transformer | <code>function</code> | Performs a transform on a property object, should return a string or object depending on the type. Will only update certain properties so you can't mess up property objects on accident. |
**Example**
```js
StyleDictionary.registerTransform({
name: 'time/seconds',
type: 'value',
matcher: function(prop) {
return prop.attributes.category === 'time';
},
transformer: function(prop) {
// Note the use of prop.original.value,
// before any transforms are performed, the build system
// clones the original property to the 'original' attribute.
return (parseInt(prop.original.value) / 1000).toString() + 's';
}
});
```
* * *
### registerTransformGroup
> StyleDictionary.registerTransformGroup(transformGroup) ⇒ [<code>style-dictionary</code>](#module_style-dictionary)
Add a custom transformGroup to the Style Dictionary, which is a
group of transforms.
| Param | Type | Description |
| --- | --- | --- |
| transformGroup | <code>Object</code> | |
| transformGroup.name | <code>String</code> | Name of the transform group that will be referenced in config.json |
| transformGroup.transforms | <code>Array.&lt;String&gt;</code> | Array of strings that reference the name of transforms to be applied in order. Transforms must be defined and match the name or there will be an error at build time. |
**Example**
```js
StyleDictionary.registerTransformGroup({
name: 'Swift',
transforms: [
'attribute/cti',
'size/pt',
'name/cti'
]
});
```
* * *
* * *
+15
View File
@@ -0,0 +1,15 @@
# Speaker
### <mark>tone</mark>
> M5.Speaker.tone(uint32_t freq);
Set the pitch of speaker.
| Param | Type | Description |
| --- | --- | --- |
| freq | <code>uint32_t</code> | frequency |
**Example**
```c++
M5.Speaker.tone(100);
```
@@ -0,0 +1,21 @@
# GPIO
*Refer to GPIO API of [Arduino](http://www.arduino.cc)*
### <mark>digitalRead</mark>
> uint32 digitalRead(uint8 pin);
Read the value of `pin`
| Param | Type | Description |
| --- | --- | --- |
| pin | <code>uint8</code> | the number of pin |
Return:
digital level(0/1)
**Example**
```c++
uint32_t pin21_data;
pin21_data = digitalRead(21);
```
+5 -5
View File
@@ -7,13 +7,13 @@
**Welcome to M5Stack Documents!**
?> **Tip** The underline words designate `more info` links leading to advanced sections about the described task.
?> The underline words designate `more info` links leading to advanced sections about the described task.
<!-- <figure class="thumbnails">
<img src="assets/img/m5stack.png" alt="Screenshot of coverpage" title="Cover page">
</figure> -->
## Introduction
<!-- ## Introduction
**M5 stack is a modular stackable development device. The M stands for Modular and 5 stands for the the units compact 5 x 5 cm size.**
@@ -21,7 +21,7 @@
Our a series of core boards are based on **ESP32** chip.
Our aim is "**Stackable Board is Product**". Here's the [Official Website](http://www.m5stack.com)
Our aim is "**Stackable Board is Product**". Here's the [Official Website](http://www.m5stack.com) -->
<!--
<figure class="thumbnails">
@@ -43,11 +43,11 @@ Our aim is "**Stackable Board is Product**". Here's the [Official Website](http:
- :mailbox_with_mail: If you have any questions, you can contact us by Email <tech@m5stack.com>
- :convenience_store: If you want to get our products, access our [Store](http://www.aliexpress.com/store/all-wholesale-products/3226069.html?spm=2114.12010108.100004.3.7e3a5379KoyhDo)
## License
<!-- ## License
This project is licensed under the [MIT license](https://github.com/watson8544/M5Stack-Documentation-docsify/blob/master/LICENSE).
Copyright (c) 2018 M5Stack ([@M5Stack](https://twitter.com/M5Stack))
Copyright (c) 2018 M5Stack ([@M5Stack](https://twitter.com/M5Stack)) -->
<!-- GitHub Buttons -->
<script async defer src="https://buttons.github.io/buttons.js"></script>
+4 -4
View File
@@ -11,7 +11,7 @@
<img src="assets/img/m5stack.png" alt="Screenshot of coverpage" title="Cover page">
</figure> -->
## 製品紹介
<!-- ## 製品紹介
**M5Stackはモジュール積み重ねるタイプの開発デバイスです。M5Stackの名前はModuleのM、5x5cmサイズの5、積み重ねるを意味するStackからきています。**
@@ -21,7 +21,7 @@ M5Stack Coreモジュールは **ESP32** チップをベースに開発されて
私たちの目的は、**<mark>誰もが簡単に自分のアイデアを形にできるような仕組みを作る</mark>**ことです。
オフィシャルサイトは [こちら](http://www.m5stack.com)です。
オフィシャルサイトは [こちら](http://www.m5stack.com)です。 -->
<!-- <figure class="thumbnails">
<img src="assets/img/transport.gif" alt="Screenshot of coverpage" title="Cover page">
@@ -51,11 +51,11 @@ M5Stack Coreモジュールは **ESP32** チップをベースに開発されて
- :mailbox_with_mail: 質問・疑問は[Email: tech@m5stack.com](mailto:tech@m5stack.com)まで
- :convenience_store: 購入は[スイッチサイエンス](https://www.switch-science.com/catalog/list/770/)または[AliExpress](https://www.aliexpress.com/store/3226069)から
## ライセンス
<!-- ## ライセンス
このプロジェクトのライセンスは[MIT license](https://github.com/watson8544/M5Stack-Documentation-docsify/blob/master/LICENSE)です。
Copyright (c) 2018 M5Stack ([@M5Stack](https://twitter.com/M5Stack))
Copyright (c) 2018 M5Stack ([@M5Stack](https://twitter.com/M5Stack)) -->
<!-- GitHub Buttons -->
<script async defer src="https://buttons.github.io/buttons.js"></script>
+4 -1
View File
@@ -2,4 +2,7 @@
[中文](/zh_CN/api_reference) | [English](/en/api_reference) | 日本語
- [LCD](ja/api_reference/api_lcd)
## [LCD](ja/api_reference/api_lcd)
## [Peripherals](ja/api_reference/peripherals/api_gpio)
### 1. [GPIO](ja/api_reference/peripherals/api_gpio)
## [Speaker](ja/api_reference/api_speaker)
+33 -232
View File
@@ -1,272 +1,73 @@
# LCD
<!-- ### buildAllPlatforms
### <mark>setbrightness</mark>
> M5.Lcd.setbrightness(uint8_t brightness);
> StyleDictionary.buildAllPlatforms() ⇒ [<code>style-dictionary</code>](#module_style-dictionary)
The only top-level method that needs to be called
to build the Style Dictionary.
**Example**
```js
const StyleDictionary = require('style-dictionary').extend('config.json');
StyleDictionary.buildAllPlatforms();
```
* * *
### buildPlatform
> StyleDictionary.buildPlatform(platform) ⇒ [<code>style-dictionary</code>](#module_style-dictionary)
Takes a platform and performs all transforms to
the properties object (non-mutative) then
builds all the files and performs any actions. This is useful if you only want to
build the artifacts of one platform to speed up the build process.
This method is also used internally in [buildAllPlatforms](#buildAllPlatforms) to
build each platform defined in the config.
Set the brightness of LCD.
| Param | Type | Description |
| --- | --- | --- |
| platform | <code>String</code> | Name of the platform you want to build. |
| brightness | <code>uint8_t</code> | brightness(0-254) |
**Example**
```js
StyleDictionary.buildPlatform('web');
```
```bash
$ style-dictionary build --platform web
```c++
M5.Lcd.setbrightness(100);
```
* * *
### cleanAllPlatforms
### <mark>fillScreen</mark>
> M5.Lcd.fillScreen(uint16_t color);
> StyleDictionary.cleanAllPlatforms() ⇒ [<code>style-dictionary</code>](#module_style-dictionary)
Does the reverse of [buildAllPlatforms](#buildAllPlatforms) by
performing a clean on each platform. This removes all the files
defined in the platform and calls the undo method on any actions.
* * *
### cleanPlatform
> StyleDictionary.cleanPlatform(platform) ⇒ [<code>style-dictionary</code>](#module_style-dictionary)
Takes a platform and performs all transforms to
the properties object (non-mutative) then
cleans all the files and perfoms the undo method of any [actions](actions).
| Param | Type |
| --- | --- |
| platform | <code>String</code> |
* * *
### exportPlatform
> StyleDictionary.exportPlatform(platform) ⇒ <code>Object</code>
Exports a properties object with applied
platform transforms.
This is useful if you want to use a style
dictionary in JS build tools like webpack.
Set the color to display of the whole LCD.
| Param | Type | Description |
| --- | --- | --- |
| platform | <code>String</code> | The platform to be exported. Must be defined on the style dictionary. |
* * *
### extend
> StyleDictionary.extend(config) ⇒ [<code>style-dictionary</code>](#module_style-dictionary)
Create a Style Dictionary
| Param | Type | Description |
| --- | --- | --- |
| config | [<code>Config</code>](#Config) | Configuration options to build your style dictionary. If you pass a string, it will be used as a path to a JSON config file. You can also pass an object with the configuration. |
| color | <code>uint16_t</code> | color value |
**Example**
```js
const StyleDictionary = require('style-dictionary').extend('config.json');
const StyleDictionary = require('style-dictionary').extend({
source: ['properties/*.json'],
platforms: {
scss: {
transformGroup: 'scss',
buildPath: 'build/',
files: [{
destination: 'variables.scss',
format: 'scss/variables'
}]
}
// ...
}
});
```c++
M5.Lcd.fillScreen(RED);
delay(500);
M5.Lcd.fillScreen(WHITE);
delay(500);
```
* * *
### registerAction
### <mark>fillRect</mark>
> M5.Lcd.fillRect(int16_t x, int16_t y, int16_t w, int16_t h, uint16_t color);
> StyleDictionary.registerAction(action) ⇒ [<code>style-dictionary</code>](#module_style-dictionary)
Adds a custom action to the style property builder. Custom
actions can do whatever you need, such as: copying files,
base64'ing files, running other build scripts, etc.
After you register a custom action, you then use that
action in a platform your config.json
Actions run after the files in a platform are generated so you
can perform operations on files generated by the style dictionary.
Actions are run sequentially, if you write synchronous code then
it will block other actions, or if you use asynchronous code like Promises
it will not block.
Draw a filled rectangle.
| Param | Type | Description |
| --- | --- | --- |
| action | <code>Object</code> | |
| action.name | <code>String</code> | The name of the action |
| action.do | <code>function</code> | The action in the form of a function. |
| [action.undo] | <code>function</code> | A function that undoes the action. |
| x, y | <code>int16_t</code> | offset of x, y direction |
| w, h | <code>int16_t</code> | width and height of graphics |
| color | <code>uint16_t</code> | color to fill |
**Example**
```js
StyleDictionary.registerAction({
name: 'copy_assets',
do: function(dictionary, config) {
console.log('Copying assets directory');
fs.copySync('assets', config.buildPath + 'assets');
},
undo: function(dictionary, config) {
console.log('Cleaning assets directory');
fs.removeSync(config.buildPath + 'assets');
}
});
```c++
M5.Lcd.fillRect(50,50,60,150,WHITE);
```
* * *
### registerFormat
### <mark>fillRoundRect</mark>
> M5.Lcd.fillRoundRect(int16_t x0, int16_t y0, int16_t w, int16_t h, int16_t radius, uint16_t color);
> StyleDictionary.registerFormat(format) ⇒ [<code>style-dictionary</code>](#module_style-dictionary)
Add a custom format to the style dictionary
Draw a filled round rectangle.
| Param | Type | Description |
| --- | --- | --- |
| format | <code>Object</code> | |
| format.name | <code>String</code> | Name of the format to be referenced in your config.json |
| format.formatter | <code>function</code> | Function to perform the format. Takes 2 arguments, `dictionary` and `config` Must return a string. |
| x, y | <code>int16_t</code> | offset of x, y direction |
| w, h | <code>int16_t</code> | width and height of graphics |
| radius | <code>int16_t</code> | fillet radius |
| color | <code>uint16_t</code> | color to fill |
**Example**
```js
StyleDictionary.registerFormat({
name: 'json',
formatter: function(dictionary, config) {
return JSON.stringify(dictionary.properties, null, 2);
}
})
```c++
M5.Lcd.fillRoundRect(50,50,60,150,4,WHITE);
```
* * *
### registerTemplate
> StyleDictionary.registerTemplate(template) ⇒ [<code>style-dictionary</code>](#module_style-dictionary)
Add a custom template to the Style Dictionary
| Param | Type | Description |
| --- | --- | --- |
| template | <code>Object</code> | |
| template.name | <code>String</code> | The name of your template. You will refer to this in your config.json file. |
| template.template | <code>String</code> | Path to your lodash template |
**Example**
```js
StyleDictionary.registerTemplate({
name: 'Swift/colors',
template: __dirname + '/templates/swift/colors.template'
});
```
* * *
### registerTransform
> StyleDictionary.registerTransform(transform) ⇒ [<code>style-dictionary</code>](#module_style-dictionary)
Add a custom transform to the Style Dictionary
Transforms can manipulate a property's name, value, or attributes
| Param | Type | Description |
| --- | --- | --- |
| transform | <code>Object</code> | Transform object |
| transform.type | <code>String</code> | Type of transform, can be: name, attribute, or value |
| transform.name | <code>String</code> | Name of the transformer so a transformGroup can call a list of transforms. |
| [transform.matcher] | <code>function</code> | Matcher function, return boolean if transform should be applied. If you omit the matcher function, it will match all properties. |
| transform.transformer | <code>function</code> | Performs a transform on a property object, should return a string or object depending on the type. Will only update certain properties so you can't mess up property objects on accident. |
**Example**
```js
StyleDictionary.registerTransform({
name: 'time/seconds',
type: 'value',
matcher: function(prop) {
return prop.attributes.category === 'time';
},
transformer: function(prop) {
// Note the use of prop.original.value,
// before any transforms are performed, the build system
// clones the original property to the 'original' attribute.
return (parseInt(prop.original.value) / 1000).toString() + 's';
}
});
```
* * *
### registerTransformGroup
> StyleDictionary.registerTransformGroup(transformGroup) ⇒ [<code>style-dictionary</code>](#module_style-dictionary)
Add a custom transformGroup to the Style Dictionary, which is a
group of transforms.
| Param | Type | Description |
| --- | --- | --- |
| transformGroup | <code>Object</code> | |
| transformGroup.name | <code>String</code> | Name of the transform group that will be referenced in config.json |
| transformGroup.transforms | <code>Array.&lt;String&gt;</code> | Array of strings that reference the name of transforms to be applied in order. Transforms must be defined and match the name or there will be an error at build time. |
**Example**
```js
StyleDictionary.registerTransformGroup({
name: 'Swift',
transforms: [
'attribute/cti',
'size/pt',
'name/cti'
]
});
```
* * *
-->
* * *
+15
View File
@@ -0,0 +1,15 @@
# Speaker
### <mark>tone</mark>
> M5.Speaker.tone(uint32_t freq);
Set the pitch of speaker.
| Param | Type | Description |
| --- | --- | --- |
| freq | <code>uint32_t</code> | frequency |
**Example**
```c++
M5.Speaker.tone(100);
```
@@ -0,0 +1,21 @@
# GPIO
*Refer to GPIO API of [Arduino](http://www.arduino.cc)*
### <mark>digitalRead</mark>
> uint32 digitalRead(uint8 pin);
Read the value of `pin`
| Param | Type | Description |
| --- | --- | --- |
| pin | <code>uint8</code> | the number of pin |
Return:
digital level(0/1)
**Example**
```c++
uint32_t pin21_data;
pin21_data = digitalRead(21);
```
+1 -1
View File
@@ -1,5 +1,5 @@
- [製品ドキュメント](ja/product_documents)
- [クイックスタート](ja/quick_start)
<!-- - [クイックスタート](ja/quick_start) -->
- [API リファレンス](ja/api_reference)
- [M5Stack アプリケーション](ja/m5stack_cases)
- [その他のドキュメント](ja/related_documents)
+1 -1
View File
@@ -1,5 +1,5 @@
- [Product Documents](en/product_documents)
- [Quick Start](en/quick_start)
<!-- - [Quick Start](en/quick_start) -->
- [API Reference](en/api_reference)
- [M5Stack Cases](en/m5stack_cases)
- [Related Documents](en/related_documents)
+8 -8
View File
@@ -1,19 +1,19 @@
# M5Stack
**Welcome to M5Stack Documents!**
[![Codacy grade](https://img.shields.io/codacy/grade/860d40719cbd4e0f91e145b87ec7c29a.svg?style=flat-square)](https://www.codacy.com/app/watson8544/M5Stack-Documentation-docsify?utm_source=github.com&amp;utm_medium=referral&amp;utm_content=watson8544/M5Stack-Documentation-docsify&amp;utm_campaign=Badge_Grade)
[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg?style=flat-square)](https://github.com/watson8544/M5Stack-Documentation-docsify/blob/master/LICENSE)
[![Tweet](https://img.shields.io/twitter/url/http/shields.io.svg?style=social)](https://twitter.com/intent/tweet?url=https%3A%2F%2Fgithub.com%2Fjhildenbiddle%2Fdocsify-themeable&hashtags=css,docsify,developers,frontend)
<a class="github-button" href="https://github.com/m5stack/m5-docs" data-icon="octicon-star" data-show-count="true" aria-label="Star M5Stack/m5-docs on GitHub">Star</a>
?> **提示** 点击下划线的蓝色字体可以跳转到对应链接。
**欢迎阅读M5Stack文档!**
?> 点击下划线的蓝色字体可以跳转到对应链接。
<!-- <figure class="thumbnails">
<img src="assets/img/m5stack.png" alt="Screenshot of coverpage" title="Cover page">
</figure> -->
## 介绍(Introduction)
<!-- ## 介绍(Introduction)
**M5是以M5Core主控为核心的一系列可堆叠、模块化的电子产品。 M 代表可堆叠的模块,5 代表模块尺寸为5 * 5 cm大小。**
@@ -21,7 +21,7 @@
我们的全系列产品基本是以<mark>ESP</mark>芯片为主芯片。
我们希望"**堆叠即是产品**"。 这是我们的[官网](http://www.m5stack.com)。
我们希望"**堆叠即是产品**"。 这是我们的[官网](http://www.m5stack.com)。 -->
<!--
<figure class="thumbnails">
@@ -45,18 +45,18 @@
|[API参考](zh_CN/api_reference_zh_CN) | [常见问题解答](zh_CN/faq_zh_CN)| -->
## 联系方式(Contact & Support)
## 联系方式
- :computer: 访问[官网](http://www.m5stack.com)了解最新的产品
- :busts_in_silhouette: 登录我们的[论坛](http://forum.m5stack.com)了解更多基于M5产品的创意设计
- :mailbox_with_mail: 如果你有对产品有任何疑问或有更好的建议,请联系我们的[邮箱](tech@m5stack.com)
- :convenience_store: 如果你想继续购买我们的产品,请访问我们的[官方旗舰店](http://www.aliexpress.com/store/all-wholesale-products/3226069.html?spm=2114.12010108.100004.3.7e3a5379KoyhDo)
## License
<!-- ## License
This project is licensed under the [MIT license](https://github.com/watson8544/M5Stack-Documentation-docsify/blob/master/LICENSE).
Copyright (c) 2018 M5Stack ([@M5Stack](https://twitter.com/M5Stack))
Copyright (c) 2018 M5Stack ([@M5Stack](https://twitter.com/M5Stack)) -->
<!-- GitHub Buttons -->
<script async defer src="https://buttons.github.io/buttons.js"></script>
+4 -1
View File
@@ -2,4 +2,7 @@
中文 | [English](/en/api_reference) | [日本語](/ja/api_reference)
- [LCD](zh_CN/api_reference/api_lcd)
## [LCD](zh_CN/api_reference/api_lcd)
## [Peripherals](zh_CN/api_reference/peripherals/api_gpio)
### 1. [GPIO](zh_CN/api_reference/peripherals/api_gpio)
## [Speaker](zh_CN/api_reference/api_speaker)
+37 -251
View File
@@ -1,287 +1,73 @@
# LCD
### buildAllPlatforms
> StyleDictionary.buildAllPlatforms() ⇒ [<code>style-dictionary</code>](#module_style-dictionary)
The only top-level method that needs to be called
to build the Style Dictionary.
**Example**
```js
const StyleDictionary = require('style-dictionary').extend('config.json');
StyleDictionary.buildAllPlatforms();
```
* * *
### buildPlatform
> StyleDictionary.buildPlatform(platform) ⇒ [<code>style-dictionary</code>](#module_style-dictionary)
Takes a platform and performs all transforms to
the properties object (non-mutative) then
builds all the files and performs any actions. This is useful if you only want to
build the artifacts of one platform to speed up the build process.
This method is also used internally in [buildAllPlatforms](#buildAllPlatforms) to
build each platform defined in the config.
### <mark>setbrightness</mark>
> M5.Lcd.setbrightness(uint8_t brightness);
设置LCD屏幕的亮度
| Param | Type | Description |
| --- | --- | --- |
| platform | <code>String</code> | Name of the platform you want to build. |
| brightness | <code>uint8_t</code> | 亮度值(0-254) |
**Example**
```js
StyleDictionary.buildPlatform('web');
```
```bash
$ style-dictionary build --platform web
**例程**
```c++
M5.Lcd.setbrightness(100);
```
* * *
### cleanAllPlatforms
> StyleDictionary.cleanAllPlatforms() ⇒ [<code>style-dictionary</code>](#module_style-dictionary)
Does the reverse of [buildAllPlatforms](#buildAllPlatforms) by
performing a clean on each platform. This removes all the files
defined in the platform and calls the undo method on any actions.
* * *
### cleanPlatform
> StyleDictionary.cleanPlatform(platform) ⇒ [<code>style-dictionary</code>](#module_style-dictionary)
Takes a platform and performs all transforms to
the properties object (non-mutative) then
cleans all the files and perfoms the undo method of any [actions](actions).
| Param | Type |
| --- | --- |
| platform | <code>String</code> |
* * *
### exportPlatform
> StyleDictionary.exportPlatform(platform) ⇒ <code>Object</code>
Exports a properties object with applied
platform transforms.
This is useful if you want to use a style
dictionary in JS build tools like webpack.
### <mark>fillScreen</mark>
> M5.Lcd.fillScreen(uint16_t color);
设置全屏颜色
| Param | Type | Description |
| --- | --- | --- |
| platform | <code>String</code> | The platform to be exported. Must be defined on the style dictionary. |
| color | <code>uint16_t</code> | 颜色值 |
* * *
### extend
> StyleDictionary.extend(config) ⇒ [<code>style-dictionary</code>](#module_style-dictionary)
Create a Style Dictionary
| Param | Type | Description |
| --- | --- | --- |
| config | [<code>Config</code>](#Config) | Configuration options to build your style dictionary. If you pass a string, it will be used as a path to a JSON config file. You can also pass an object with the configuration. |
**Example**
```js
const StyleDictionary = require('style-dictionary').extend('config.json');
const StyleDictionary = require('style-dictionary').extend({
source: ['properties/*.json'],
platforms: {
scss: {
transformGroup: 'scss',
buildPath: 'build/',
files: [{
destination: 'variables.scss',
format: 'scss/variables'
}]
}
// ...
}
});
**例程**
```c++
M5.Lcd.fillScreen(RED);
delay(500);
M5.Lcd.fillScreen(WHITE);
delay(500);
```
* * *
### registerAction
> StyleDictionary.registerAction(action) ⇒ [<code>style-dictionary</code>](#module_style-dictionary)
Adds a custom action to the style property builder. Custom
actions can do whatever you need, such as: copying files,
base64'ing files, running other build scripts, etc.
After you register a custom action, you then use that
action in a platform your config.json
Actions run after the files in a platform are generated so you
can perform operations on files generated by the style dictionary.
Actions are run sequentially, if you write synchronous code then
it will block other actions, or if you use asynchronous code like Promises
it will not block.
### <mark>fillRect</mark>
> M5.Lcd.fillRect(int16_t x, int16_t y, int16_t w, int16_t h, uint16_t color);
画填充形式的矩形图形
| Param | Type | Description |
| --- | --- | --- |
| action | <code>Object</code> | |
| action.name | <code>String</code> | The name of the action |
| action.do | <code>function</code> | The action in the form of a function. |
| [action.undo] | <code>function</code> | A function that undoes the action. |
| x, y | <code>int16_t</code> | x和y方向的偏移量 |
| w, h | <code>int16_t</code> | 图形宽和高 |
| color | <code>uint16_t</code> | 填充的颜色 |
**Example**
```js
StyleDictionary.registerAction({
name: 'copy_assets',
do: function(dictionary, config) {
console.log('Copying assets directory');
fs.copySync('assets', config.buildPath + 'assets');
},
undo: function(dictionary, config) {
console.log('Cleaning assets directory');
fs.removeSync(config.buildPath + 'assets');
}
});
**例程**
```c++
M5.Lcd.fillRect(50,50,60,150,WHITE);
```
* * *
### registerFormat
> StyleDictionary.registerFormat(format) ⇒ [<code>style-dictionary</code>](#module_style-dictionary)
Add a custom format to the style dictionary
### <mark>fillRoundRect</mark>
> M5.Lcd.fillRoundRect(int16_t x0, int16_t y0, int16_t w, int16_t h, int16_t radius, uint16_t color);
画填充形式的圆角矩形图形
| Param | Type | Description |
| --- | --- | --- |
| format | <code>Object</code> | |
| format.name | <code>String</code> | Name of the format to be referenced in your config.json |
| format.formatter | <code>function</code> | Function to perform the format. Takes 2 arguments, `dictionary` and `config` Must return a string. |
| x, y | <code>int16_t</code> | x和y方向的偏移量 |
| w, h | <code>int16_t</code> | 图形宽和高 |
| radius | <code>int16_t</code> | 圆角半径 |
| color | <code>uint16_t</code> | 填充的颜色 |
**Example**
```js
StyleDictionary.registerFormat({
name: 'json',
formatter: function(dictionary, config) {
return JSON.stringify(dictionary.properties, null, 2);
}
})
**例程**
```c++
M5.Lcd.fillRoundRect(50,50,60,150,4,WHITE);
```
* * *
### registerTemplate
> StyleDictionary.registerTemplate(template) ⇒ [<code>style-dictionary</code>](#module_style-dictionary)
Add a custom template to the Style Dictionary
| Param | Type | Description |
| --- | --- | --- |
| template | <code>Object</code> | |
| template.name | <code>String</code> | The name of your template. You will refer to this in your config.json file. |
| template.template | <code>String</code> | Path to your lodash template |
**Example**
```js
StyleDictionary.registerTemplate({
name: 'Swift/colors',
template: __dirname + '/templates/swift/colors.template'
});
```
* * *
### registerTransform
> StyleDictionary.registerTransform(transform) ⇒ [<code>style-dictionary</code>](#module_style-dictionary)
Add a custom transform to the Style Dictionary
Transforms can manipulate a property's name, value, or attributes
| Param | Type | Description |
| --- | --- | --- |
| transform | <code>Object</code> | Transform object |
| transform.type | <code>String</code> | Type of transform, can be: name, attribute, or value |
| transform.name | <code>String</code> | Name of the transformer so a transformGroup can call a list of transforms. |
| [transform.matcher] | <code>function</code> | Matcher function, return boolean if transform should be applied. If you omit the matcher function, it will match all properties. |
| transform.transformer | <code>function</code> | Performs a transform on a property object, should return a string or object depending on the type. Will only update certain properties so you can't mess up property objects on accident. |
**Example**
```js
StyleDictionary.registerTransform({
name: 'time/seconds',
type: 'value',
matcher: function(prop) {
return prop.attributes.category === 'time';
},
transformer: function(prop) {
// Note the use of prop.original.value,
// before any transforms are performed, the build system
// clones the original property to the 'original' attribute.
return (parseInt(prop.original.value) / 1000).toString() + 's';
}
});
```
* * *
### registerTransformGroup
> StyleDictionary.registerTransformGroup(transformGroup) ⇒ [<code>style-dictionary</code>](#module_style-dictionary)
Add a custom transformGroup to the Style Dictionary, which is a
group of transforms.
| Param | Type | Description |
| --- | --- | --- |
| transformGroup | <code>Object</code> | |
| transformGroup.name | <code>String</code> | Name of the transform group that will be referenced in config.json |
| transformGroup.transforms | <code>Array.&lt;String&gt;</code> | Array of strings that reference the name of transforms to be applied in order. Transforms must be defined and match the name or there will be an error at build time. |
**Example**
```js
StyleDictionary.registerTransformGroup({
name: 'Swift',
transforms: [
'attribute/cti',
'size/pt',
'name/cti'
]
});
```
* * *
* * *
+15
View File
@@ -0,0 +1,15 @@
# Speaker
### <mark>tone</mark>
> M5.Speaker.tone(uint32_t freq);
设置声音音高
| Param | Type | Description |
| --- | --- | --- |
| freq | <code>uint32_t</code> | 频率 |
**例程**
```c++
M5.Speaker.tone(100);
```
@@ -0,0 +1,21 @@
# GPIO
*使用Arduino库的GPIO API*
### <mark>digitalRead</mark>
> uint32 digitalRead(uint8 pin);
读取数字引脚电平值
| Param | Type | Description |
| --- | --- | --- |
| pin | <code>uint8</code> | 引脚编号 |
Return:
电平值(0/1)
**例程**
```c++
uint32_t pin21_data;
pin21_data = digitalRead(21);
```
+1 -1
View File
@@ -1,5 +1,5 @@
- [产品介绍](zh_CN/product_documents)
- [快速上手](zh_CN/quick_start)
<!-- - [快速上手](zh_CN/quick_start) -->
- [API参考](zh_CN/api_reference)
- [M5Stack案例](zh_CN/m5stack_cases)
- [相关文档](zh_CN/related_documents)