hbulider初學(xué)的一個(gè)小例子

來(lái)源：懂視網(wǎng) 責(zé)編：小采時(shí)間：2020-11-27 20:17:00

hbulider初學(xué)的一個(gè)小例子

hbulider初學(xué)的一個(gè)小例子:一.hbulider工具的使用1） hbulider的特點(diǎn)： 1.飛快的編碼速度 2.HBuilder直接創(chuàng)建移動(dòng)App，打包為ios或Android原生安裝包 3.HTML5語(yǔ)法、HTML5+語(yǔ)法、三大瀏覽器擴(kuò)展語(yǔ)法，盡收HBuilder中 4.綠柔設(shè)置界面，更加護(hù)眼 2）下載hbulider安裝包

推薦度：

點(diǎn)擊下載本文 文檔為doc格式

導(dǎo)讀hbulider初學(xué)的一個(gè)小例子:一.hbulider工具的使用1） hbulider的特點(diǎn)： 1.飛快的編碼速度 2.HBuilder直接創(chuàng)建移動(dòng)App，打包為ios或Android原生安裝包 3.HTML5語(yǔ)法、HTML5+語(yǔ)法、三大瀏覽器擴(kuò)展語(yǔ)法，盡收HBuilder中 4.綠柔設(shè)置界面，更加護(hù)眼 2）下載hbulider安裝包

一.hbulider工具的使用

1）

hbulider的特點(diǎn)：

1.飛快的編碼速度

2.HBuilder直接創(chuàng)建移動(dòng)App，打包為ios或Android原生安裝包

3.HTML5語(yǔ)法、HTML5+語(yǔ)法、三大瀏覽器擴(kuò)展語(yǔ)法，盡收HBuilder中

4.綠柔設(shè)置界面，更加護(hù)眼

2）

下載hbulider安裝包

百度搜索hbulider，進(jìn)入官方網(wǎng)站，點(diǎn)擊右上角 download 按鈕，即可下載。

4）

下載完成后可以看到下載到的是一個(gè)壓縮包，打開(kāi)下載的壓縮包，將壓縮包內(nèi)的文件解壓到希望存放的位置，點(diǎn)擊確定。

5）

解壓完成后，找到解壓位置，點(diǎn)擊hbulider.exe文件，開(kāi)始安裝。

6）打開(kāi)后選擇一個(gè)一般用來(lái)存放代碼的文件夾作為代碼目錄。

7）根據(jù)自己的實(shí)際情況，選擇所能看清楚的顏色塊，然后點(diǎn)擊下方生成適合你的視覺(jué)方案生成一個(gè)舒適的配色。

8）選擇喜歡的視覺(jué)主題，點(diǎn)擊下面的確認(rèn)并關(guān)閉，完成設(shè)置。

9）完成后進(jìn)入到歡迎向?qū)В鐖D，到此安裝完成。

三.用hbulider寫一個(gè)五子棋小程序

<!DOCTYPE html>
<html>
 <head>
 <meta charset="utf-8" />
 <title>五子棋游戲</title>
 </head>
 <body>
 <canvas id="myCanvas" width="570" height="570" 
 style="border: 2px solid #abcabc"></canvas>
 
 <!--作者：offline
 時(shí)間：2017-07-03描述：使用js代碼控制游戲邏輯-->
 <script type="text/javascript">//獲取canvas的標(biāo)簽var ChessCanvas = document.getElementById("myCanvas");//獲取畫布var gameCanvas = ChessCanvas.getContext("2d");//定義棋盤大小var map = 25;//棋子大小var chessSize = 24; //獲取下棋的坐標(biāo) var x = y = 0;//棋子的顏色var isRed = true;//==true的該下紅棋 否則下黑棋var color = "#000000";//棋子數(shù)組 二維數(shù)組//保存所下的棋子 0：未下；1：下紅棋；2：下黑棋var chessData = new Array(23);for(var i=0;i<23;i++)
 {
 chessData[i] =new Array(23);for(var j=0;j<23;j++)
 {
 chessData[i][j] = 0;
 }
 }//所下棋子在棋子數(shù)組的位置var i,j;//繪制棋盤for(var i=0;i<23;i++)
 {
 gameCanvas.moveTo(10,10+i*map);
 gameCanvas.lineTo(560,10+i*map);
 gameCanvas.moveTo(10+i*map,10);
 gameCanvas.lineTo(10+i*map,560);
 gameCanvas.stroke();//畫 }//創(chuàng)建函數(shù)，完成下棋function addChess(x,y)
 {//下棋 畫小圓圈 角度轉(zhuǎn)弧度 π/180×角度 弧度變角度 180/π×弧度gameCanvas.beginPath();//開(kāi)始gameCanvas.arc(x,y,12,0,Math.PI*2,true);//畫棋子gameCanvas.fillStyle = color;
 gameCanvas.fill();
 gameCanvas.closePath();//結(jié)束if(color=="#000000")
 {
 color = "#ff0000";//黑棋chessData[i][j] = 2;
 
 
 }else{
 color = "#000000";//紅棋chessData[i][j] = 1;
 
 }
 
 }//重復(fù)調(diào)用 在做坦克大戰(zhàn)之類游戲 需要使用。。。。// window.setInterval(函數(shù),時(shí)間);
 //游戲是否結(jié)束// function isGameWin()//如果是人機(jī)對(duì)戰(zhàn)版，則需要下棋的AI 如果不是人機(jī)對(duì)戰(zhàn) 則下完棋后，提醒對(duì)方下棋// function gameAI() //做鼠標(biāo)監(jiān)聽(tīng) 游戲邏輯document.onmousedown= function(e)
 {
 window.onclick = function (){ 
 //獲取下棋的坐標(biāo)i = Math.round((e.x-10)/25);
 j = Math.round((e.y-10)/25);//邊界不能下//判斷該位置x，y是否可以下棋x = i*25+10;
 y = j*25+10; //判斷該位置ij是否有棋子if(chessData[i][j]==0)
 {//下棋 addChess(x,y);
 
 
 }else{
 alert("不好意思！你來(lái)晚了，已經(jīng)被對(duì)方捷足先登了");
 }
 
 
 }
 } 
 </script>
 
 </body>
</html>

代碼不全，會(huì)陸續(xù)加上。

聲明：本網(wǎng)頁(yè)內(nèi)容旨在傳播知識(shí)，若有侵權(quán)等問(wèn)題請(qǐng)及時(shí)與本網(wǎng)聯(lián)系，我們將在第一時(shí)間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com

hbulider初學(xué)的一個(gè)小例子

推薦度：

點(diǎn)擊下載本文 文檔為doc格式

標(biāo)簽：一個(gè) 有一個(gè) 學(xué)習(xí)

熱門焦點(diǎn)

hbulider初學(xué)的一個(gè)小例子

hbulider初學(xué)的一個(gè)小例子

hbulider初學(xué)的一個(gè)小例子

最新推薦

猜你喜歡

熱門推薦