欢迎各位兄弟 发布技术文章

这里的技术是共享的

You are here

qMobi + Android 试手

shiping1 的头像

jqMobi + Android 试手

作者:shareach | 出处:博客园 | 阅读592次 2012/3/19 1:08:27
 

忙活的一个晚上,搞定了一个界面,主要在滚动条和风格上花了不少时间,jqMobi的文档真的少的可怜,希望文档可以多点,以下是几份参考资料:

  1. 最新的Api参考:http://www.shareach.com/jq/
  2. 一些简单的范例:http://www.appmobi.com/amdocs/lib/jqMobi_Cheat.pdf?r=8877
  3. 还有youtube上的两个视频http://www.youtube.com/watch?v=y9ft-UYJa6I&feature=youtu.behttp://www.youtube.com/watch?v=pQjrRWjNeo4&feature=youtu.be
  4. forums:http://forums.appmobi.com/viewforum.php?f=26

总之资料太少了,具体一个晚上搞了两样东西:

和JQuery mobile一样,也是head、content、foot,不过jqmobi的navi要比JQuery的foot好用,包括滚动效果

滚动效果

<div id="content" > 
        <div title='个人资料' id="userprofile" class="panel" selected="true"> 
        这里是要滚动的内容 
        </div>

</div>

记住一定要class是panel,selected属性表示当前元素是否可见,content是内容容器,里面可以有多个panel,也可以如下来设置一个滚动

$("#scroller").scroller({ 
                scrollBars: true, 
                verticalScroll: true, 
                horizontalScroll: false, 
                vScrollCSS: "jqmScrollbar", 
                hScrollCSS: "jqmScrollbar" 
            });

api上基本上把所有的风格都给加载了,慢慢肯源码才知道玄机在style的link节点上,在api页面的代码里有:

function setActiveStyleSheet(title) { 
   var a = document.getElementsByTagName("link"); 
   var currElem; 
   
   if(title==oldElem.getAttribute("title")||oldElem=="default") 
      return; 
   for(i=0; i<a.length; i++) { 
   
       if(a[i].getAttribute("title")==title){ 
         currElem=a[i]; 
       } 
       else if(!a[i].getAttribute("disabled")&&a[i].getAttribute("title")) 
          oldElem=a[i]; 
   } 
   
   currElem.removeAttribute("disabled"); 
   jq.ui.showMask(); 
   window.setTimeout(function(){ 
      jq.ui.hideMask(); 
      oldElem.setAttribute("disabled","true"); 
   },500); 
}

 

未完,具体参见 http://www.shareach.com/?p=111 更新

来自 http://www.haogongju.net/art/1351841

普通分类: