經(jīng)過(guò)一年的打磨，終于在這個(gè)月結(jié)束之前將小盒子的iOS版和Mac開發(fā)完成并上架了。把自己臆想出來(lái)的一種制作app的思路實(shí)現(xiàn)出來(lái)（雖然目前的完成度只有60%)，心里還是有點(diǎn)小得意的。
今天在微博發(fā)出了第一條推廣微博，得到了一小部分人的關(guān)注（貌似都是程序員)?？吹接腥苏f(shuō)Xcode就可以做到這種拖拽UI并運(yùn)行到手機(jī)上，我有點(diǎn)失落，但是確實(shí)是自己的文案沒(méi)配好圖，將人誤導(dǎo)了。小盒子在拖拽UI的部分有參考XCode,但是它的重頭戲在數(shù)據(jù)的部分(接下來(lái)會(huì)加入更強(qiáng)大的服務(wù))。后面我會(huì)加入更多自己曾經(jīng)做過(guò)的復(fù)雜控件進(jìn)來(lái)，讓用戶可以只設(shè)置幾個(gè)參數(shù)就能看到酷炫的效果。
原本打算下個(gè)月開始寫教程的，但是看到大多數(shù)用戶都很迷惑，我忍不住先打個(gè)樣了。
接下來(lái)我將從0開始用小盒子做出一個(gè)小視頻工具
第一步： 設(shè)置數(shù)據(jù)源
因?yàn)檫@里的數(shù)據(jù)來(lái)自網(wǎng)絡(luò)，所有先點(diǎn)擊右上角的 "Http Tool"（很抱歉我將這個(gè)設(shè)置成了內(nèi)購(gòu)功能）。
這里我用的糗事百科的視頻接口"https://m2.qiushibaike.com/article/list/video?count=30&page=1"。直接復(fù)制到地址欄，點(diǎn)擊發(fā)送。獲取到結(jié)果。（必須獲取到結(jié)果之后，后面使用數(shù)據(jù)才能正常顯示)。這里有一個(gè)參數(shù)page是可變的。所以需要將其設(shè)置成外部數(shù)據(jù),意思是從外部(頁(yè)面參數(shù)或控件的值)去獲取。
最后點(diǎn)擊保存，將接口存儲(chǔ)下來(lái)
第二步: 設(shè)置頁(yè)面事件
選中左側(cè)任意一個(gè)頁(yè)面之后，頂部會(huì)出現(xiàn)頁(yè)面數(shù)據(jù)和頁(yè)面事件兩個(gè)按鈕。
點(diǎn)擊頁(yè)面數(shù)據(jù)去設(shè)置當(dāng)前頁(yè)面需要的數(shù)據(jù)，默認(rèn)有四個(gè)數(shù)據(jù)。這里我們可以選中pageData,用它來(lái)接收剛才接口返回的數(shù)據(jù)
這里相當(dāng)于用pageData去保存視頻接口返回的一個(gè)數(shù)組
現(xiàn)在就可以去頁(yè)面事件里面創(chuàng)建一個(gè)網(wǎng)絡(luò)請(qǐng)求的事件。
這里有兩個(gè)地方需要設(shè)置，左側(cè)的page是我們第一步里的
外部參數(shù)，我們將它交給頁(yè)面自帶的參數(shù)page.這樣就可以實(shí)現(xiàn)分頁(yè)加載數(shù)據(jù)。右側(cè)則是將第一步中網(wǎng)絡(luò)返回的數(shù)據(jù)交給我們上面設(shè)置的PageData。
到這里整個(gè)數(shù)據(jù)流程就設(shè)置完成了。我簡(jiǎn)單的捋一下。
數(shù)據(jù)源(網(wǎng)絡(luò)接口) -> 通過(guò)事件配置 將數(shù)據(jù)交給 -> 頁(yè)面數(shù)據(jù)
第三步 將數(shù)據(jù)展示到頁(yè)面控件上
在右側(cè)欄中編輯當(dāng)前頁(yè)面
- 將頁(yè)面設(shè)置為
豎直視頻即抖音風(fēng)格 - 填充模板數(shù)據(jù)。
視頻的數(shù)據(jù)來(lái)自于步驟二中的視頻接口。每條數(shù)據(jù)都來(lái)自items數(shù)組(這里要確保數(shù)據(jù)類型為Array,否則后面參數(shù)將不可選)，然后依次設(shè)置用戶名為login, 標(biāo)題content，封面pic_url, 視頻鏈接origin_url。
到此為止，一個(gè)小視頻工具就完成了。下圖是手機(jī)上的效果
最后要提醒一下，制作程序時(shí)一定別忘了加一個(gè)工程列表,否則你將無(wú)法在手機(jī)端自由切換工程了
添加一個(gè)列表，選中cell之后，設(shè)置右邊的事件為
工程列表即可
將工程包導(dǎo)入到手機(jī)端有多種方式
方式一
這也是最方便的方式，通過(guò)隔空投送發(fā)送到手機(jī)，會(huì)默認(rèn)使用小盒子打開
方式二
QQ或微信 等工具收到文件后，點(diǎn)擊右上角 -> "用其他應(yīng)用打開"。 選擇小盒子即可
下面是上面demo的工程包。可以下載后直接使用
點(diǎn)擊下載
