1.  我想大家做iOS移動(dòng)端開發(fā)去做微信小程序感覺挺新奇的本人是這個(gè)想法，愿意嘗試。這段時(shí)間不是很忙公司留給時(shí)間學(xué)習(xí)微信小程序開發(fā)。我也就小結(jié)一下。我依舊是菜鳥無(wú)法與大神相提并論，大神的話不許要看下面可以直接走開。入門前還是要對(duì)小程序有所了解。微信小程序簡(jiǎn)單，快捷，用后即關(guān)。我這種用戶就是這樣，需要了看下，不需要百年都不會(huì)打開看一眼。

2.  準(zhǔn)備工作：

1> 看官方文檔，全都看完了解一下。我是這么搞的。

2> 不建議直接開發(fā)，你畢竟是iOS開發(fā)工程師。你甚至不懂html就不要搞wxml。js、css、及json文件都是搞啥的。開發(fā)前要明白這些。本人是知道后直接上手的。

3> 不需要急因?yàn)闆]用，就如讓你搞個(gè)即時(shí)通信自做（Websocket）你都不知道是啥搞個(gè)毛，不推薦直接上手，我無(wú)法堅(jiān)持，毛都不會(huì)如何上手，這看一點(diǎn)那看一點(diǎn)。最后還是亂套迷糊。走過(guò)的坑高速自己還是一步步來(lái)。很快就可以搞得定。搞程序切記眼高手低。本人還是回歸根本。我是一只小小鳥，只想跟隨大神們的腳步，一步步走。

4> 如果你公司有個(gè)做前端的，那么恭喜你。你可以減少一半的學(xué)習(xí)時(shí)間。我是比較幸運(yùn)的。微信小程序開發(fā)工具確實(shí)不是很友善各種字符硬敲，各種標(biāo)簽，我一搞iOS開發(fā)的看見就煩，但還是要靜下心。畢竟出來(lái)沒多長(zhǎng)時(shí)間，相信一定會(huì)越來(lái)越好。

5> 本人是從布局開始搞起的因?yàn)榈暨^(guò)很多坑了。統(tǒng)一學(xué)習(xí)的。慢慢總結(jié)，還是要靠一些記憶力的。對(duì)于方法封裝及傳數(shù)據(jù)，及等等吧，也大差不差。不過(guò)不要再以iOS的寫法標(biāo)準(zhǔn)考慮小程序。完全不一個(gè)東西。

3. css小結(jié)一下：

display:flex; 這是什么鬼東西呢，

1. flex布局為默認(rèn)橫向排列元素

2. flex-direction 決定元素排列方向

3. flex-wrap 決定元素如何換行（數(shù)據(jù)多的時(shí)候）

nowrap 默認(rèn)值。規(guī)定靈活的項(xiàng)目不拆行或不拆列。

wrap  規(guī)定靈活的項(xiàng)目在必要的時(shí)候拆行或拆列。

wrap-reverse  規(guī)定靈活的項(xiàng)目在必要的時(shí)候拆行或拆列，但是以相反的順序。

initial 設(shè)置該屬性為它的默認(rèn)值。請(qǐng)參閱 initial。

inherit 從父元素繼承該屬性。請(qǐng)參閱 inherit。

4.flex-flow

flex-flow: wrap row，編譯運(yùn)行結(jié)果：如圖5所示，flex-flow相當(dāng)于 flex-direction和 flex-wrap兩個(gè)屬性的組合

5. justify-content:center

:space-between每個(gè)子view左右都有留邊，但是首尾兩個(gè)view各自左右對(duì)齊不留邊

:space-around---效果如圖8所示，每個(gè)子view左右都有留邊

6.position: relative;  // 相對(duì)定位 position: absolute;      // 絕對(duì)定位

。。。。。。。。

下面你看到就熟悉了哦。開心一下。

1. 尺寸

width: 228rpx;  // 寬度

height: 228rpx; //  高度

min-width:    //最小寬度

max-width:    //最大寬度

min-height:  //最小高度

max-height:  //最大高度

...

2. 背景

background-color: darkcyan;  //背景顏色

...

3. 邊框

border-radius: 20%;    //邊框圓角

border-width: 5px;      //邊框?qū)挾?/p>

border-color: #ddd;    //邊框顏色

border-style: solid;    //邊框樣式

...

4. 邊距

margin: 20rpx;      //外邊距，邊框距離父級(jí)元素的距離

margin: 14rpx 50rpx 30rpx 50rpx;    // 上右下左   1px =2rpx

padding: 20rpx;    //內(nèi)邊距，邊框距離元素的距離

padding: 10rpx 20rpx 30rpx 40rpx;    // 上右下左

5. 文本

font-size: 30px;    //字體大小

 

這只是其中一點(diǎn)點(diǎn)哦可見路還很遙遠(yuǎn)對(duì)吧。沒錯(cuò)，不過(guò)相信自己一定可以的。本人以前考空余時(shí)間搞過(guò)java語(yǔ)法，考這個(gè)自己還做了一個(gè)小賣鋪的系統(tǒng)。哈哈