mirror of
https://github.com/m5stack/m5-docs.git
synced 2026-05-20 10:23:01 -07:00
add desktop ide tutorial
This commit is contained in:
Vendored
+53
@@ -1106,3 +1106,56 @@ mark {
|
||||
width: 100%
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
.platform-box {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
|
||||
.platform-item {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
margin: 20px;
|
||||
box-shadow: 0px 0px 5px 0px #dbdbdb;
|
||||
border-radius: 15px;
|
||||
}
|
||||
|
||||
.platform-item h3 {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
font-size: 20px;
|
||||
font-weight: normal;
|
||||
color: #fff;
|
||||
z-index: 11;
|
||||
}
|
||||
|
||||
|
||||
.platform-tag{
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 45%;
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
margin: -60px 0 0 -60px;
|
||||
background: #333;
|
||||
opacity: .8;
|
||||
border-radius: 50%;
|
||||
z-index: 10;
|
||||
-webkit-transform: scale(1, 1);
|
||||
-moz-transform: scale(1, 1);
|
||||
transform: scale(1, 1);
|
||||
-webkit-transition: all .3s;
|
||||
-moz-transition: all .3s;
|
||||
transition: all .5s cubic-bezier(0.23, 0.53, 0.22, 0.93);
|
||||
}
|
||||
|
||||
.platform-item a:hover .platform-tag{
|
||||
transform: scale(4.3, 4.3);
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 123 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 106 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 143 KiB |
@@ -1,31 +1,20 @@
|
||||
# M5Core Get Started {docsify-ignore-all}
|
||||
|
||||
<!-- **Choose the development platform**
|
||||
|
||||
|<img src="assets/img/macos-logo.png"> | <img src="assets/img/windows-logo.png"> | <img src="assets/img/uiflow-logo.png">|
|
||||
|:---:|:---:|:---:|
|
||||
|[Arduino-MacOS](en/quick_start/m5core/m5stack_core_get_started_Arduino_MacOS) | [Arduino-Windows](en/quick_start/m5core/m5stack_core_get_started_Arduino_Windows) | [UIFlow (Blockly & Micropython)](en/quick_start/m5core/m5stack_core_get_started_MicroPython)| -->
|
||||
|
||||
## Choose the development platform
|
||||
|
||||
<div class="container">
|
||||
<div class="card-deck mb-3 text-center">
|
||||
<div class="card mb-4 shadow-sm">
|
||||
<div class="card-body">
|
||||
<img src="assets/img/macos-logo.png" height="170px" style="margin:15px">
|
||||
<a href="#en/quick_start/m5core/m5stack_core_get_started_Arduino_MacOS" style="text-decoration:none"><button type="button" class="btn btn-lg btn-block btn-outline-primary">Arduino-MacOS</button></a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card mb-4 shadow-sm">
|
||||
<div class="card-body">
|
||||
<img src="assets/img/windows-logo.png" height="170px" style="margin:15px">
|
||||
<a href="#en/quick_start/m5core/m5stack_core_get_started_Arduino_Windows" style="text-decoration:none"><button type="button" class="btn btn-lg btn-block btn-outline-primary">Arduino-Windows</button></a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card mb-4 shadow-sm">
|
||||
<div class="card-body">
|
||||
<img src="assets/img/uiflow-logo.png" height="150px" style="margin:25px">
|
||||
<a href="#en/quick_start/m5core/m5stack_core_get_started_MicroPython" style="text-decoration:none"><button type="button" class="btn btn-lg btn-block btn-outline-primary">UIFlow</button></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="platform-box">
|
||||
<div class="platform-item">
|
||||
<img src="assets\img\arduino-card.jpg" width="300px">
|
||||
<a href="/#/en/arduino/arduino_development">
|
||||
<h3>Arduino IDE</h3>
|
||||
<div class="platform-tag"></div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="platform-item">
|
||||
<img src="assets\img\uiflow-card.jpg" width="300px">
|
||||
<a href="/#/en/uiflow/introduction">
|
||||
<h3>UIFlow</h3>
|
||||
<div class="platform-tag"></div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,37 +1,27 @@
|
||||
# M5StickC Quick Start {docsify-ignore-all}
|
||||
|
||||
<!-- **Choose the development platform**
|
||||
|
||||
|<img src="assets/img/macos-logo.png"> | <img src="assets/img/windows-logo.png"> | <img src="assets/img/uiflow-logo.png">|
|
||||
|:---:|:---:|:---:|
|
||||
|[Arduino-MacOS](en/quick_start/m5stickc/m5stickc_quick_start_with_arduino_MacOS) | [Arduino-Windows](en/quick_start/m5stickc/m5stickc_quick_start_with_arduino_Windows) | [UIFlow](en/quick_start/m5stickc/m5stickc_quick_start_with_uiflow)| -->
|
||||
|
||||
## Choose the development platform
|
||||
|
||||
<div class="container">
|
||||
<div class="card-deck mb-4 text-center">
|
||||
<div class="card mb-3 shadow-sm">
|
||||
<div class="card-body">
|
||||
<img src="assets/img/macos-logo.png" height="170px" style="margin:15px">
|
||||
<a href="#en/quick_start/m5stickc/m5stickc_quick_start_with_arduino_MacOS" style="text-decoration:none"><button type="button" class="btn btn-lg btn-block btn-outline-primary">Arduino-MacOS</button></a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card mb-3 shadow-sm">
|
||||
<div class="card-body">
|
||||
<img src="assets/img/windows-logo.png" height="170px" style="margin:15px">
|
||||
<a href="#en/quick_start/m5stickc/m5stickc_quick_start_with_arduino_Windows" style="text-decoration:none"><button type="button" class="btn btn-lg btn-block btn-outline-primary">Arduino-Windows</button></a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card mb-3 shadow-sm">
|
||||
<div class="card-body">
|
||||
<img src="assets/img/uiflow-logo.png" height="150px" style="margin:25px">
|
||||
<a href="#en/quick_start/m5stickc/m5stickc_quick_start_with_uiflow" style="text-decoration:none"><button type="button" class="btn btn-lg btn-block btn-outline-primary">UIFlow</button></a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card mb-3 shadow-sm">
|
||||
<div class="card-body">
|
||||
<img src="assets/img/aws-logo.png" height="150px" style="margin:25px">
|
||||
<a href="#en/quick_start/m5stickc/m5stickc_quick_start_with_AWS-FreeRTOS_Windows" style="text-decoration:none"><button type="button" class="btn btn-lg btn-block btn-outline-primary">FreeRTOS</button></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="platform-box">
|
||||
<div class="platform-item">
|
||||
<img src="assets\img\arduino-card.jpg" width="300px">
|
||||
<a href="/#/en/arduino/arduino_development">
|
||||
<h3>Arduino IDE</h3>
|
||||
<div class="platform-tag"></div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="platform-item">
|
||||
<img src="assets\img\uiflow-card.jpg" width="300px">
|
||||
<a href="/#/en/uiflow/introduction">
|
||||
<h3>UIFlow</h3>
|
||||
<div class="platform-tag"></div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="platform-item">
|
||||
<img src="assets\img\aws-freertos-card.jpg" width="300px">
|
||||
<a href="/#/en/quick_start/m5stickc/m5stickc_quick_start_with_AWS-FreeRTOS_Windows">
|
||||
<h3>AWS FreeRTOS</h3>
|
||||
<div class="platform-tag"></div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 126 KiB |
|
Before Width: | Height: | Size: 3.4 KiB After Width: | Height: | Size: 3.4 KiB |
+524
-64
File diff suppressed because one or more lines are too long
+26
-21
@@ -363,6 +363,7 @@
|
||||
var Label1 = '<a onclick="page_move(\'here is the anchor_id\')">';
|
||||
var Label2 = '<span style="padding: 8px 0px;">here is the anchor_name</span></a>';
|
||||
function anchor_create(anchor_name,anchor_id){
|
||||
var page_url = window.location.href;
|
||||
var Part_A = Label1.replace(/here is the anchor_id/, anchor_id);
|
||||
var Part_B = Label2.replace(/here is the anchor_name/, anchor_name.toUpperCase());
|
||||
if((anchor_name == "DESCRIPTION")||(anchor_name == "描述")){
|
||||
@@ -392,38 +393,37 @@
|
||||
$("#example_video")[0].pause();
|
||||
})
|
||||
}
|
||||
}else if(page_url.indexOf(/uiflow/) != -1){
|
||||
$(".anchor-box").append(Part_A+quickstart_icon+Part_B);
|
||||
}
|
||||
}
|
||||
function anchor_search(purchase_link="none",quickstart_link="none"){
|
||||
var page_url = window.location.href;
|
||||
if((page_url.slice(-4) == "/en/")||(page_url.slice(-7)== "/zh_CN/")||(page_url.slice(-3)== "/#/")){
|
||||
$("#search_note").eq(0).after("<div class='anchor-box'></div>");
|
||||
var anchor_list= $(".product_page > div:gt(1)");
|
||||
for (var i=0; i< anchor_list.length ; i++){
|
||||
anchor_create(anchor_list[i].id.toUpperCase(), anchor_list[i].id);
|
||||
var page_url = window.location.href;
|
||||
if((page_url.slice(-4) == "/en/")||(page_url.slice(-7)== "/zh_CN/")||(page_url.slice(-3)== "/#/")){
|
||||
$("#search_note").eq(0).after("<div class='anchor-box'></div>");
|
||||
var anchor_list= $(".product_page > div:gt(1)");
|
||||
}
|
||||
else{
|
||||
$("h2").eq(0).before("<div class='anchor-box'></div>");
|
||||
var anchor_list= $("#main h2");
|
||||
}
|
||||
}
|
||||
else{
|
||||
$("h2").eq(0).before("<div class='anchor-box'></div>");
|
||||
var anchor_list= $("#main h2");
|
||||
for (var i=0; i< anchor_list.length ; i++){
|
||||
anchor_create(anchor_list[i].id.toUpperCase(), anchor_list[i].id);
|
||||
if(page_url.indexOf(/zh_CN/) != -1) {
|
||||
var purchase_name = "购买链接"
|
||||
var quickstart_name = "快速上手"
|
||||
}
|
||||
else {
|
||||
var purchase_name = "PURCHASE"
|
||||
var quickstart_name = "QUICK START"
|
||||
}
|
||||
anchor_create(anchor_list[i].id.toUpperCase(), anchor_list[i].id);
|
||||
}
|
||||
if(page_url.indexOf(/zh_CN/) != -1) {
|
||||
var purchase_name = "购买链接"
|
||||
var quickstart_name = "快速上手"
|
||||
}
|
||||
else {
|
||||
var purchase_name = "PURCHASE"
|
||||
var quickstart_name = "QUICK START"
|
||||
}
|
||||
if(purchase_link!="none"){
|
||||
$(".anchor-box").append('<a href='+purchase_link+' onclick="select(this)" target="view_window">'+purchase_icon+'<span style="padding: 8px 0px;">'+purchase_name+'</span>'+'</a>');
|
||||
}
|
||||
if(quickstart_link!="none"){
|
||||
$(".anchor-box").append('<a href='+quickstart_link+' onclick="select(this)" target="view_window">'+quickstart_icon+'<span style="padding: 8px 0px;">'+quickstart_name+'</span>'+'</a>');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function anchor_scroll(anchor_name,anchor_id,anchor_length){
|
||||
@@ -473,7 +473,11 @@
|
||||
|
||||
|
||||
<script>
|
||||
|
||||
|
||||
|
||||
function creat_pdf() {
|
||||
$('html, body').animate({scrollTop: 0}, 0);
|
||||
$(".anchor-box").css("display","none");
|
||||
$(".related_links").css("display","none");
|
||||
var target = document.getElementsByClassName("#main")[0];
|
||||
@@ -481,6 +485,7 @@ function creat_pdf() {
|
||||
onrendered:function(canvas) {
|
||||
var contentWidth = canvas.width;
|
||||
var contentHeight = canvas.height;
|
||||
|
||||
//一页pdf显示html页面生成的canvas高度;
|
||||
var pageHeight = contentWidth / 592.28 * 841.89;
|
||||
//未生成pdf的html页面高度
|
||||
|
||||
@@ -59,7 +59,7 @@ M5Stack Basic 由两个可分离部分堆叠组成. 顶部放置了电路板,
|
||||
|
||||
## EasyLoader
|
||||
|
||||
>EasyLoader是一个简洁快速的程序烧录器,每一个产品页面里的EasyLoader都提供了一个与产品相关的案例程序,通过简单步骤将其烧录至主控,能够进行一系列的功能验证.**(目前EasyLoader仅适用于Windows操作系统)**
|
||||
>EasyLoader是一个简洁快速的程序烧录器,其内置了一个产品相关的案例程序,通过简单步骤将其烧录至主控,即可进行一系列的功能验证.**(程序烧录前,请根据设备类型安装相应驱动程序. M5Core型主机[请点击此处查看CP210X驱动安装教程](zh_CN/arduino/arduino_development?id=安装串口驱动),M5StickC/V/T/ATOM系列可免驱动使用)**
|
||||
|
||||
<div class="easyloader-box">
|
||||
<div style="background-color:white;">
|
||||
@@ -277,7 +277,7 @@ M5Stack Basic 由两个可分离部分堆叠组成. 顶部放置了电路板,
|
||||
|
||||
var purchase_link = 'https://m5stack.com/collections/m5-core/products/basic-core-iot-development-kit';
|
||||
|
||||
var quickstart_link = 'https://docs.m5stack.com/#/zh_CN/quick_start/m5core/m5stack_core_quick_start';
|
||||
var quickstart_link = '/#/zh_CN/quick_start/m5core/m5stack_core_quick_start';
|
||||
|
||||
anchor_search(purchase_link,quickstart_link);
|
||||
scrollFunc();
|
||||
|
||||
@@ -72,3 +72,20 @@
|
||||
- [Lite Example](https://github.com/m5stack/M5-ProductExampleCodes/tree/master/Core/Atom/Atom%20Lite)
|
||||
|
||||
|
||||
|
||||
<!-- <div class="platform-box">
|
||||
<div class="platform-item">
|
||||
<img src="assets\img\arduino-card.jpg" width="300px">
|
||||
<a href="#zh_CN/quick_start/m5core/m5stack_core_get_started_Arduino_Windows">
|
||||
<h3>Arduino IDE</h3>
|
||||
<div class="platform-tag"></div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="platform-item">
|
||||
<img src="assets\img\uiflow-card.jpg" width="300px">
|
||||
<a href="#/zh_CN/uiflow/introduction">
|
||||
<h3>UIFlow</h3>
|
||||
<div class="platform-tag"></div>
|
||||
</a>
|
||||
</div>
|
||||
</div> -->
|
||||
@@ -184,4 +184,12 @@ lcd.print("Hello M5Stack")
|
||||
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
</style>
|
||||
|
||||
<script>
|
||||
|
||||
anchor_search();
|
||||
scrollFunc();
|
||||
|
||||
</script>
|
||||
@@ -2,24 +2,19 @@
|
||||
|
||||
## 选择您使用的开发平台
|
||||
|
||||
<div class="container">
|
||||
<div class="card-deck mb-3 text-center">
|
||||
<div class="card mb-4 shadow-sm">
|
||||
<div class="card-body">
|
||||
<img src="assets/img/macos-logo.png" height="170px" style="margin:15px">
|
||||
<a href="#zh_CN/quick_start/m5core/m5stack_core_get_started_Arduino_MacOS" style="text-decoration:none"><button type="button" class="btn btn-lg btn-block btn-outline-primary">Arduino-MacOS</button></a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card mb-4 shadow-sm">
|
||||
<div class="card-body">
|
||||
<img src="assets/img/windows-logo.png" height="170px" style="margin:15px">
|
||||
<a href="#zh_CN/quick_start/m5core/m5stack_core_get_started_Arduino_Windows" style="text-decoration:none"><button type="button" class="btn btn-lg btn-block btn-outline-primary">Arduino-Windows</button></a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card mb-4 shadow-sm">
|
||||
<div class="card-body">
|
||||
<img src="assets/img/uiflow-logo.png" height="150px" style="margin:25px">
|
||||
<a href="#zh_CN/quick_start/m5core/m5stack_core_get_started_MicroPython" style="text-decoration:none"><button type="button" class="btn btn-lg btn-block btn-outline-primary">UIFlow</button></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="platform-box">
|
||||
<div class="platform-item">
|
||||
<img src="assets\img\arduino-card.jpg" width="300px">
|
||||
<a href="/#/zh_CN/arduino/arduino_development">
|
||||
<h3>Arduino IDE</h3>
|
||||
<div class="platform-tag"></div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="platform-item">
|
||||
<img src="assets\img\uiflow-card.jpg" width="300px">
|
||||
<a href="/#/zh_CN/uiflow/introduction">
|
||||
<h3>UIFlow</h3>
|
||||
<div class="platform-tag"></div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,40 +1,27 @@
|
||||
# M5StickC 上手指南 {docsify-ignore-all}
|
||||
|
||||
<!-- ## 选择您需要的编程语言
|
||||
|
||||
|
||||
|<img src="assets/img/windows-logo.png"> | <img src="assets/img/uiflow-logo.png">|
|
||||
|:---:|:---:|
|
||||
|[Arduino-Windows](zh_CN/quick_start/m5stickc/m5stickc_quick_start_with_arduino_Windows) | [UIFlow](zh_CN/quick_start/m5stickc/m5stickc_quick_start_with_uiflow)| -->
|
||||
|
||||
|
||||
## 选择您使用的开发平台
|
||||
|
||||
<div class="container">
|
||||
<div class="card-deck mb-4 text-center">
|
||||
<div class="card mb-3 shadow-sm">
|
||||
<div class="card-body">
|
||||
<img src="assets/img/macos-logo.png" height="170px" style="margin:15px">
|
||||
<a href="#zh_CN/quick_start/m5stickc/m5stickc_quick_start_with_arduino_MacOS" style="text-decoration:none"><button type="button" class="btn btn-lg btn-block btn-outline-primary">Arduino-MacOS</button></a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card mb-3 shadow-sm">
|
||||
<div class="card-body">
|
||||
<img src="assets/img/windows-logo.png" height="170px" style="margin:15px">
|
||||
<a href="#zh_CN/quick_start/m5stickc/m5stickc_quick_start_with_arduino_Windows" style="text-decoration:none"><button type="button" class="btn btn-lg btn-block btn-outline-primary">Arduino-Windows</button></a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card mb-3 shadow-sm">
|
||||
<div class="card-body">
|
||||
<img src="assets/img/uiflow-logo.png" height="150px" style="margin:25px">
|
||||
<a href="#zh_CN/quick_start/m5stickc/m5stickc_quick_start_with_uiflow" style="text-decoration:none"><button type="button" class="btn btn-lg btn-block btn-outline-primary">UIFlow</button></a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card mb-3 shadow-sm">
|
||||
<div class="card-body">
|
||||
<img src="assets/img/aws-logo.png" height="150px" style="margin:25px">
|
||||
<a href="#zh_CN/quick_start/m5stickc/m5stickc_quick_start_with_AWS-FreeRTOS_Windows" style="text-decoration:none"><button type="button" class="btn btn-lg btn-block btn-outline-primary">FreeRTOS</button></a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="platform-box">
|
||||
<div class="platform-item">
|
||||
<img src="assets\img\arduino-card.jpg" width="300px">
|
||||
<a href="/#/zh_CN/arduino/arduino_development">
|
||||
<h3>Arduino IDE</h3>
|
||||
<div class="platform-tag"></div>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="platform-item">
|
||||
<img src="assets\img\uiflow-card.jpg" width="300px">
|
||||
<a href="/#/zh_CN/uiflow/introduction">
|
||||
<h3>UIFlow</h3>
|
||||
<div class="platform-tag"></div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="platform-item">
|
||||
<img src="assets\img\aws-freertos-card.jpg" width="300px">
|
||||
<a href="/#/zh_CN/quick_start/m5stickc/m5stickc_quick_start_with_AWS-FreeRTOS_Windows">
|
||||
<h3>AWS FreeRTOS</h3>
|
||||
<div class="platform-tag"></div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -9,7 +9,7 @@
|
||||
|
||||
5. [UIFlow教程](#UIFlow教程)
|
||||
|
||||
## 安装UIFlow固件
|
||||
## UIFlow固件
|
||||
|
||||
* __下载驱动程序__
|
||||
|
||||
@@ -101,6 +101,7 @@
|
||||
|
||||
>Atom的APIKey可以通过web配网页面查看,或通过串口工具查看
|
||||
|
||||
<<<<<<< HEAD
|
||||
><img src="assets/img/product_pics/core/minicore/atom/apikey.png" width="50%"><img src="assets/img/product_pics/core/minicore/atom/serialtool.png" width="50%">
|
||||
|
||||
|
||||
@@ -155,20 +156,18 @@
|
||||
><img src="/image/base/usbmode.jpg" width="50%" height="50%">
|
||||
|
||||
## UIFlow教程
|
||||
=======
|
||||
## 相关教材
|
||||
>>>>>>> 3cd56af95d6b315f183720dac88d2b3e42c9401e
|
||||
|
||||
* [M5StickC物联网入门教程](https://m5stack.oss-cn-shenzhen.aliyuncs.com/resource/docs/M5StickC_Guide.pdf)
|
||||
|
||||
* [M5GO编程入门教程](https://m5stack.oss-cn-shenzhen.aliyuncs.com/resource/docs/UIFlow-Book-zh_cn.pdf)
|
||||
|
||||
|
||||
<script>
|
||||
|
||||
<style>
|
||||
|
||||
.link a{
|
||||
|
||||
padding-left: 13%;
|
||||
|
||||
}
|
||||
|
||||
</style>
|
||||
anchor_search();
|
||||
scrollFunc();
|
||||
|
||||
</script>
|
||||
Reference in New Issue
Block a user