Android开发之ApiCloud轮播图开发
生活随笔
收集整理的這篇文章主要介紹了
Android开发之ApiCloud轮播图开发
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
首先看下效果圖：
效果還可以吧。
如何開發呢？
首先可以在apicloud模塊庫中里面搜索UIScrollPicture這個模塊添加后即可開發，調用方法也很簡單有相應的文檔說明不過有的參數不是很容易理解，我修改了下官方的demo，代碼如下：
<!DOCTYPE HTML> <html><head><meta charset="utf-8"><meta name="viewport" content="maximum-scale=1.0, minimum-scale=1.0, user-scalable=0, initial-scale=1.0, width=device-width" /><meta name="format-detection" content="telephone=no, email=no, date=no, address=no"><title>Hello APP</title><link rel="stylesheet" type="text/css" href="../css/api.css" /><style>label {margin: 10px;font-size: 24px;}ul {margin-bottom: 10px;}ul li {margin: 5px 10px;padding: 5px;color: #000;word-wrap: break-word;}</style><style type="text/css">html {background-color: white;padding: 10px;}header {border-bottom: 1px solid #ccc;padding: 25px 0;}span {padding: 5px 5px;margin: 5px;display: inline-block;background-color: #e8e8e8;}</style> </head><body><span class="clickbtn" tapmode="active" οnclick="takeSDKActivity()">打開SDK頁面</span><span class="clickbtn" tapmode="active" οnclick="openRTSPPlayerActivity()">打開RTSP視頻</span></br><span tapmode οnclick="fnOpen()">open()</span><span tapmode οnclick="fnClose()">close()</span><span tapmode οnclick="fnShow()">show()</span><span tapmode οnclick="fnHide()">hide()</span><span tapmode οnclick="fnSetCurrentIndex()">setCurrentIndex()</span><span tapmode οnclick="fnReloadData()">reloadData()</span><span tapmode οnclick="fnAddEventListener()">addEventListener()</span> </body> <script type="text/javascript" src="../script/api.js"></script> <script type="text/javascript">var XiaYiYeModule = null;var VLCPlayerModule = null;var UIScrollPicture;apiready = function() {XiaYiYeModule = api.require('XiaYiYeModule');VLCPlayerModule = api.require('VLCPlayerModule');UIScrollPicture = api.require('UIScrollPicture');}function takeSDKActivity() {var param = {appParam: "打開了SDK頁面了"};XiaYiYeModule.startXiayiyeActivity(param);}function openRTSPPlayerActivity() {var param = {appParam: "rtsp://wowzaec2demo.streamlock.net/vod/mp4:BigBuckBunny_115k.mov"};VLCPlayerModule.startVLCActivity(param);}function fnOpen() {UIScrollPicture.open({rect : {x : 0,y : 240,w : api.winWidth,h : 300},data : {paths : ['http://p2.so.qhimg.com/t011d3ccbad92e11237.jpg', 'widget://res/t01c8026adad49a51f.jpg', 'widget://res/gogd.jpg'],//這里圖片地址可為本地地址和網絡地址，http的網絡地址，或者widget的本地地址還有fs開頭的，不過fs我還不太理解captions : ['貓', '可愛的萌寵喵星人', '西伯利亞,哈士奇犬,狗,兩個,成年人,坐,一起', 'title4', 'title5']},styles : {caption : {height : 35,color : '#E0FFFF',size : 13,bgColor : '#696969',position : 'bottom'},indicator : {align : 'center',color : '#FFFFFF',activeColor : '#DA70D6'}},placeholderImg : 'widget://res/cat.jpg',contentMode : 'scaleToFill',interval : 3,loop : true,fixedOn: "main",//這里表示的是輪播圖依附在那個頁面上，我這里是因為輪播圖在main這個frame里面所有寫的mainfixed : false}, function(ret, err) {if (ret) {alert(JSON.stringify(ret));} else {alert(JSON.stringify(err));}});};function fnClose() {UIScrollPicture.close();};function fnShow() {UIScrollPicture.show();};function fnHide() {UIScrollPicture.hide();};function fnSetCurrentIndex() {UIScrollPicture.setCurrentIndex({index : 2});};function fnReloadData() {UIScrollPicture.reloadData({data : {paths : ['http://p2.so.qhimg.com/t017ccbb9391da2b4a7.jpg', 'http://p3.so.qhimg.com/t01d12e93583a86b823.jpg', 'http://p1.so.qhimg.com/t01cf5cad6fa213da81.jpg'],captions : ['title1', 'title2', 'title3']//這里分別是圖片的網絡地址和圖片對應的標題}});};function fnAdEventListener() {UIScrollPicture.addEventListener({name : 'scroll'}, function(ret, err) {if (ret) {alert(JSON.stringify( ret ));} else {alert(JSON.stringify( err ));}});}; </script></html>實在看不懂得，可以下載源碼查看：
點擊打開下載源碼
總結
以上是生活随笔為你收集整理的Android开发之ApiCloud轮播图开发的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： Android开发之ApiCloud模块
- 下一篇： Android开发之自定义菊花进度条对话