履带精灵1.5号----程式代码（初版+A版）
本帖最后由 wing 于 2017-10-9 14:29 编辑昨天把硬件装好，今日趁热打铁把程式也写好了。
基本功能都正常，然而只是初版还有很大优化空间。
怕之后就没机会了，所以还是先发上来了
界面效果
页面代码
<html><head><meta http-equiv="Content-Type" content="text/html; charset=windows-1252"><title>PWM</title>
<style type="text/css">input.vertical { -webkit-appearance: slider-vertical; writing-mode: bt-lr; width:100px; height:400px; }</style>
<script type="text/javascript">
function roc(S)
{
var txt;
var url;
url ="pwm2.q?";
if (S==1)
{
txt = document.getElementById("r_l").value;
url =url+"l=" + escape(txt);
}
if (S==2)
{
txt = document.getElementById("r_r").value;
url =url+"r=" + escape(txt);
}
var xhr = new XMLHttpRequest();
xhr.open("GET", url, true);
xhr.onreadystatechange = function(e){
if (xhr.readyState == 4) {
var rtn = xhr.responseText;
if (rtn.indexOf("l")>=0)
{document.getElementById("t_l").value = rtn;}
if (rtn.indexOf("r")>=0)
{document.getElementById("t_r").value = rtn;}
}};
xhr.send();}
</script>
</head><body><table><tbody><tr><td><input type="range" min="-1000" max="1000" value="0" class="vertical" ontouchend="roc(1)" onmouseup="roc(1)" id="r_l"></td><td><table><tbody><tr><td><label for="t_l">l:</label></td><td><input type="text" id="t_l"></td></tr><tr><td><label for="t_r">r:</label></td><td><input type="text" id="t_r"></td></tr></tbody></table></td><td><input type="range" min="-1000" max="1000" value="0" class="vertical" ontouchend="roc(2)" onmouseup="roc(2)" id="r_r"></td></tr></tbody></table></body></html>
主控程式代码
//8266 AP +ws 1.5号机 wifi ssid=ESP8266xxxxxxxx pwd=ap20170930 访问 http://192.168.128.1/pe15.html 可见网页
#include <ESP8266WiFi.h>
#include <ESP8266WebServer.h>
#include <FS.h> //文件系统库SPIFFS
ESP8266WebServer server ( 80 );
int p_a_fx =13; //A机方向GPIO13 ->D12
int p_a_dl =0; //A机动力 GPIO0->D3
int p_b_fx =16; //B机方向GPIO16->D13
int p_b_dl =12; //B机动力GPIO12->D11
void ch_page() {
if(SPIFFS.exists("/pe15.html")){//如果文件存在
File file = SPIFFS.open("/pe15.html", "r"); //打开文件
size_t sent = server.streamFile(file, "text/html");//发送内容
file.close(); //关闭文件
return;
}
else
{
handleNotFound(); //404
}
}
void pwm2_page() {
String p= "";
String sv;
int iv;
int ix;
//server.args()这个应该是返回参数的个数
if (server.hasArg("r")) //是否有r参数
{//设置A机运转状态
sv=server.arg("r");
p="r="+sv; //取r参数值
server.send(200, "text/plain", p);
iv=sv.toInt();
if (iv>=0){
digitalWrite(p_a_fx, 1); //A设置方向为正向
}
else{
digitalWrite(p_a_fx, 0); //A设置方向为逆向
iv=iv*-1;
}
if (iv<=200)//A机动力
{analogWrite(p_a_dl,0); }
else
{analogWrite(p_a_dl,iv); }
return;
}
if (server.hasArg("l"))
{
sv=server.arg("l");
p="l="+sv;
server.send(200, "text/plain", p);
iv=sv.toInt();
if (iv>=0){
digitalWrite(p_b_fx, 0); //B设置方向为逆向 A和变方向是相反的
}
else{
digitalWrite(p_b_fx, 1); //B设置方向为正向 A和变方向是相反的
iv=iv*-1;
}
if (iv<=200)//B机动力
{analogWrite(p_b_dl,0); }
else
{analogWrite(p_b_dl,iv); }
return;
}
}
void handleNotFound() {
String message = "File Not Found\n\n";
message += "URI: ";
message += server.uri();
message += "\nMethod: ";
message += ( server.method() == HTTP_GET ) ? "GET" : "POST";
message += "\nArguments: ";
message += server.args();
message += "\n";
for ( uint8_t i = 0; i < server.args(); i++ ) {
message += " " + server.argName ( i ) + ": " + server.arg ( i ) + "\n";
}
server.send ( 404, "text/plain", message );// 返回信息给浏览器（状态码，Content-type， 内容）
}
void setup() {
SPIFFS.begin();
//启用电机A的2个管脚，全部设置为输出状态
pinMode(p_a_fx,OUTPUT); //A机方向
digitalWrite(p_a_fx, 0);
pinMode(p_a_dl,OUTPUT); //A机动力
digitalWrite(p_a_dl, 0);
//启用电机B的2个管脚，全部设置为输出状态
pinMode(p_b_fx,OUTPUT); //B机方向
digitalWrite(p_b_fx, 0);
pinMode(p_b_dl,OUTPUT); //B机动力
digitalWrite(p_b_dl, 0);
analogWriteRange(1023); //PWM取值范围
// 设置内网
IPAddress softLocal(192,168,128,1);
IPAddress softGateway(192,168,128,1);
IPAddress softSubnet(255,255,255,0);
WiFi.softAPConfig(softLocal, softGateway, softSubnet);
String apName = ("ESP8266_"+(String)ESP.getChipId());
const char *softAPName = apName.c_str();
WiFi.softAP(softAPName, "ap20170930");
IPAddress myIP = WiFi.softAPIP();
server.on ( "/inline", []() {server.send ( 200, "text/plain", "this works as well" );} );
server.on ( "/pe15.html", ch_page );
server.on ( "/pwm2.q", pwm2_page );
server.onNotFound ( handleNotFound );
server.begin();
}
void loop ( void ) {
server.handleClient();
}
2楼有简单说明
7楼更新程式版本A2017-10-09 本帖最后由 wing 于 2017-9-30 20:19 编辑
这个是完整的程式文件包，有兴趣的朋友可以观摩一下
网页页面文件是独立的，使用SPIFFS文件保存 上存flash文件工具ESP8266FS-0.3.0(所在位置D:\arduino-1.6.12\tools\ESP8266FS\tool\esp8266fs.jar) 目前只在1.6.12版本中成功上存文件，Flash Size:"4M(1M SPIFFS)" ，数据文件放在工程目录下/data/...文件夹里
最后祝大家节日快乐 这个厉害，楼主那个网页怎么的
努力微笑 发表于 2017-10-1 02:19
这个厉害，楼主那个网页怎么的
通过两条rang来控制左右履带的速度，样子就是楼顶那个图。
目前还在改进中...
通过两条rang来控制左右履带的速度，这个想走直线很难吧！ 本帖最后由 wing 于 2017-10-3 13:26 编辑
独行者 发表于 2017-10-3 08:43
通过两条rang来控制左右履带的速度，这个想走直线很难吧！
这个问题问得很好，这个是我一直努力的目标之一。
如果有视频就可以更好地说明问题，不过这个有点困难：你知道它需要用手机来控制的，得找另个人拍摄。
那么希望假期结束后还有人能活着回来吧
PS:我上面说“rang”其实是错误的，应该是“range”才对 本帖最后由 wing 于 2017-10-9 14:36 编辑
更新控制程式 A版本
//8266 AP +ws 1.5号机 wifi ssid=ESP8266xxxxxxxx pwd=ap20171008 访问 http://192.168.128.1/pe15a.html 可见网页
#include <ESP8266WiFi.h>
#include <ESP8266WebServer.h>
#include <FS.h> //文件系统库SPIFFS
ESP8266WebServer server ( 80 );
int p_a_fx =13; //A机方向GPIO13 ->D12
int p_a_dl =0; //A机动力 GPIO0->D3
int p_b_fx =16; //B机方向GPIO16->D13
int p_b_dl =12; //B机动力GPIO12->D11
void ch_page() {
if(SPIFFS.exists("/pe15a.html")){//如果文件存在
File file = SPIFFS.open("/pe15a.html", "r"); //打开文件
size_t sent = server.streamFile(file, "text/html");//发送内容
file.close(); //关闭文件
return;
}
else
{
handleNotFound(); //404
}
}
void pwm2_page() {
String p= "";
String sv;
int iv;
int ix;
//server.args()这个应该是返回参数的个数
if (server.hasArg("a")) //是否有a参数
{//设置A机运转状态
sv=server.arg("a");
p="a="+sv; //准备A相关的返回值
iv=sv.toInt();
if (iv>=0){
digitalWrite(p_a_fx, 1); //A设置方向为正向
}
else{
digitalWrite(p_a_fx, 0); //A设置方向为逆向
iv=iv*-1;
}
if (iv<=300)//A机动力
{analogWrite(p_a_dl,0); }
else
{analogWrite(p_a_dl,iv); }
}
if (server.hasArg("b")) //是否有b参数
{
sv=server.arg("b");
p=p+" b="+sv; //准备B相关的返回值
iv=sv.toInt();
if (iv>=0){
digitalWrite(p_b_fx, 0); //B设置方向为逆向 A和变方向是相反的
}
else{
digitalWrite(p_b_fx, 1); //B设置方向为正向 A和变方向是相反的
iv=iv*-1;
}
if (iv<=300)//B机动力
{analogWrite(p_b_dl,0); }
else
{analogWrite(p_b_dl,iv); }
}
server.send(200, "text/plain", p);//抛出返回信息
}
void handleNotFound() {
String message = "File Not Found\n\n";
message += "URI: ";
message += server.uri();
message += "\nMethod: ";
message += ( server.method() == HTTP_GET ) ? "GET" : "POST";
message += "\nArguments: ";
message += server.args();
message += "\n";
for ( uint8_t i = 0; i < server.args(); i++ ) {
message += " " + server.argName ( i ) + ": " + server.arg ( i ) + "\n";
}
server.send ( 404, "text/plain", message );// 返回信息给浏览器（状态码，Content-type， 内容）
}
void setup() {
SPIFFS.begin();
//启用电机A的2个管脚，全部设置为输出状态
pinMode(p_a_fx,OUTPUT); //A机方向
digitalWrite(p_a_fx, 0);
pinMode(p_a_dl,OUTPUT); //A机动力
digitalWrite(p_a_dl, 0);
//启用电机B的2个管脚，全部设置为输出状态
pinMode(p_b_fx,OUTPUT); //B机方向
digitalWrite(p_b_fx, 0);
pinMode(p_b_dl,OUTPUT); //B机动力
digitalWrite(p_b_dl, 0);
analogWriteRange(1023); //PWM取值范围
// 设置内网
IPAddress softLocal(192,168,128,1);
IPAddress softGateway(192,168,128,1);
IPAddress softSubnet(255,255,255,0);
WiFi.softAPConfig(softLocal, softGateway, softSubnet);
String apName = ("ESP8266_"+(String)ESP.getChipId());
const char *softAPName = apName.c_str();
WiFi.softAP(softAPName, "ap20171008");
IPAddress myIP = WiFi.softAPIP();
server.on ( "/inline", []() {server.send ( 200, "text/plain", "this works as well" );} );
server.on ( "/pe15a.html", ch_page );
server.on ( "/pwm15a.q", pwm2_page );
server.onNotFound ( handleNotFound );
server.begin();
}
void loop ( void ) {
server.handleClient();
}
控制页面也更新了
<html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>PE15A</title>
<style type="text/css">
input.vertical { -webkit-appearance: slider-vertical; writing-mode: bt-lr; width:200px; height:400px; }
button.btn_stp {background-color: #4CAF50;border: none;color: white;padding: 15px 32px;text-align: center;text-decoration: none;display: inline-block;font-size: 24px;margin: 4px 2px;cursor: pointer;width: 350px;}
</style>
<script type="text/javascript">
function roc(s)
{
var txt;
var txt2;
var diff;
var diff_no;
var url;
url ="pwm15a.q?";
if (s==1)
{
url =url+"a=0&b=0";
}
else
{
txt = document.getElementById("r_a").value;
txt2 = document.getElementById("r_b").value;
if (document.getElementById("cb_a").checked || document.getElementById("cb_b").checked)
{
diff=document.getElementById("t_diff").value;
diff_no=Number(diff);
if (document.getElementById("cb_a").checked)
{
if ((txt<0 && txt2<0)||(txt>0 && txt2>0))
{
txt2=txt;
}
else
{
txt2=txt*-1;
}
if (txt2>0)
{
txt2=txt2-(diff_no*-1);
}
else
{
txt2=txt2-diff_no;
}
}
else
{
if ((txt<0 && txt2<0)||(txt>0 && txt2>0))
{
txt=txt2;
}
else
{
txt=txt2*-1;
}
if (txt>0)
{
txt=txt-(diff_no*-1);
}
else
{
txt=txt-diff_no;
}
}
}
url =url+"a=" + escape(txt)+"&b=" + escape(txt2);
}
var xhr = new XMLHttpRequest();
xhr.open("GET", url, true);
xhr.onreadystatechange = function(e){
if (xhr.readyState == 4) {
var rtn = xhr.responseText;
document.getElementById("t_return").value = rtn;
}
};
xhr.send();}
</script>
</head><body><table><tbody><tr><td>
<input type="range" min="-1000" max="1000" value="0" class="vertical" ontouchend="roc()" onmouseup="roc(0)" id="r_a" />
</td><td>
<table><tbody><tr><td><button id="btn_stp1" class="btn_stp" onClick="roc(1)" >STOP</button></td></tr>
<tr><td><label for="cb_a">FollowA:</label><input type="checkbox" id="cb_a" defaultChecked=false /></td></tr>
<tr><td><label for="t_return">Return:</label></td><td><input type="text" id="t_return" /></td></tr>
<tr><td><label for="t_diff">Diff:</label></td><td><input type="text" id="t_diff" /></td></tr>
<tr><td><label for="cb_b">FollowB:</label><input type="checkbox" id="cb_b" defaultChecked=false /></td></tr>
<tr><td><button id="btn_stp2" class="btn_stp" onClick="roc(1)" >STOP</button></td></tr></tbody></table>
</td><td>
<input type="range" min="-1000" max="1000" value="0" class="vertical" ontouchend="roc()" onmouseup="roc(0)" id="r_b" />
</td></tr></tbody></table></body></html>
控制界面加了停止按钮，刹车更方便了
界面效果如下
页:
[1]