Android
iOS：
代码：
<?xml version="1.0" encoding="utf-8"?>
<imag>
<script>
<![CDATA[
var array = [{icon:"http://www.imagapp.com/project/imag/imag-douglasDemo/images/icon2.jpg",name:"张三"},{icon:"http://www.imagapp.com/project/imag/imag-douglasDemo/images/icon4.jpg",name:"李四"},{icon:"http://www.imagapp.com/project/imag/imag-douglasDemo/images/icon5.jpg",name:"王五"},{icon:"http://www.imagapp.com/project/imag/imag-douglasDemo/images/icon3.jpg",name:"赵六"},{icon:"http://www.imagapp.com/project/imag/imag-douglasDemo/images/icon2.jpg",name:"晶晶"},{icon:"http://www.imagapp.com/project/imag/imag-douglasDemo/images/icon3.jpg",name:"三天"},{icon:"http://www.imagapp.com/project/imag/imag-douglasDemo/images/icon4.jpg",name:"七"},{icon:"http://www.imagapp.com/project/imag/imag-douglasDemo/images/icon1.jpg",name:"阿基米花"},{icon:"http://www.imagapp.com/project/imag/imag-douglasDemo/images/icon1.jpg",name:"花花"}];
function initList() {
var listJson = {items:[]};
for (var i = 0; i < array.length; i++) {
var itemJson = {
template:0,
sortlabel: array[i].name,
widgets:{
name:{text:array[i].name},
icon:{src:array[i].icon}
}
}
listJson.items.push(itemJson);
}
listJson.items.push({template:2,sortlabel:"*1",widgets:{
name:{text:"新的朋友"},
icon:{src:"newFriend.png"}
}});
listJson.items.push({template:2,sortlabel:"*2",widgets:{
name:{text:"群聊"},
icon:{src:"group.png"}
}});
listJson.items.push({template:2,sortlabel:"*3",widgets:{
name:{text:"标签"},
icon:{src:"tag.png"}
}});
listJson.items.push({template:2,sortlabel:"*4",widgets:{
name:{text:"公众号"},
icon:{src:"office.png"}
}});
$('list').update(listJson);
}
$page.onload = function() {
initList();
}
]]>
</script>
<page style="background:white">
<tabs style="background:#fcfcfc;" scrollable="true">
<tab label="微信" icon="tab_chat_unSelect.png,tab_chat_select.png" style="label-color:#8f8f8f,#46be1e">
<title style="background:#373b3e;padding:0 5">
<left>
<label style="color:#ffffff">微信</label>
</left>
<right>
<icon src="search.png" style="margin:0 10;"/>
<icon src="add.png" style="margin:0 10"/>
</right>
</title>
<content style="background:#ffffff;">
<list type="transparent">
<item style="col-width:50,*,40;margin:5;col-valign:top,top,top">
<col><row><img style="width:45;height:45;" src="http://www.imagapp.com/project/imag/imag-douglasDemo/images/icon1.jpg"/></row></col>
<col>
<row><label>阿基米花</label></row>
<row><label style="color:#999999;font-size:14;">你在干啥？</label></row>
</col>
<col>
<row><label style="font-size:12;color:#999999">09:30</label></row>
<row><icon/></row>
</col>
</item>
<item style="padding:0;"><col><row style="height:2px;background:#e0e0e0;"></row></col></item>
<item style="col-width:50,*,40;margin:5;col-valign:top,top,top">
<col><row><img style="width:45;height:45;" src="http://www.imagapp.com/project/imag/imag-douglasDemo/images/icon2.jpg"/></row></col>
<col>
<row><label>米花阿基</label></row>
<row><label style="color:#999999;font-size:14;">你猜呀。</label></row>
</col>
<col>
<row><label style="font-size:12;color:#999999">08:30</label></row>
<row><icon/></row>
</col>
</item>
<item style="padding:0;"><col><row style="height:2px;background:#e0e0e0;"></row></col></item>
<item style="col-width:50,*,40;margin:5;col-valign:top,top,top">
<col><row><img style="width:45;height:45;" src="http://www.imagapp.com/project/imag/imag-douglasDemo/images/icon3.jpg"/></row></col>
<col>
<row><label>基米花阿</label></row>
<row><label style="color:#999999;font-size:14;">你猜我猜不猜。</label></row>
</col>
<col>
<row><label style="font-size:12;color:#999999">08:20</label></row>
<row><icon/></row>
</col>
</item>
<item style="padding:0;"><col><row style="height:2px;background:#e0e0e0;"></row></col></item>
<item style="col-width:50,*,40;margin:5;col-valign:top,top,top">
<col><row><img style="width:45;height:45;" src="http://www.imagapp.com/project/imag/imag-douglasDemo/images/icon4.jpg"/></row></col>
<col>
<row><label>花阿基米</label></row>
<row><label style="color:#999999;font-size:14;">哦，不猜。</label></row>
</col>
<col>
<row><label style="font-size:12;color:#999999">07:30</label></row>
<row><icon/></row>
</col>
</item>
<item style="padding:0;"><col><row style="height:2px;background:#e0e0e0;"></row></col></item>
</list>
</content>
<footer><list type="transparent"><item style="padding:0;"><col><row style="height:2px;background:#e0e0e0;"></row></col></item></list></footer>
</tab>
<tab label="通讯录" icon="tab_contacts_unSelect.png,tab_contacts_select.png" style="label-color:#8f8f8f,#46be1e">
<title style="background:#373b3e;padding:0 5">
<left>
<label style="color:#ffffff">微信</label>
</left>
<right>
<icon src="search.png" style="margin:0 10;"/>
<icon src="add.png" style="margin:0 10"/>
</right>
</title>
<content>
<list id="list" style="background:#ffffff;" reuse="sort" type="transparent">
<item style="col-width:55,*;margin:0 10;padding:5 0;divider-border:1 #e0e0e0">
<col><row><img style="width:35;height:35;" reusekey="icon"/></row></col>
<col><row><label reusekey="name"></label></row></col>
</item>
<item style="padding:0;"><col><row style="height:2px;background:#e0e0e0;"></row></col></item>
<item style="col-width:55,*;margin:0 10;padding:5 0;divider-border:1 #e0e0e0">
<col><row><icon style="width:35;height:35;margin:0;padding:0;" reusekey="icon"/></row></col>
<col><row><label reusekey="name"></label></row></col>
</item>
</list>
</content>
<footer><list type="transparent"><item style="padding:0;"><col><row style="height:2px;background:#e0e0e0;"></row></col></item></list></footer>
</tab>
<tab label="发现" icon="tab_discover_unSelect.png,tab_discover_select.png" style="label-color:#8f8f8f,#46be1e">
<title style="background:#373b3e;padding:0 5">
<left>
<label style="color:#ffffff">微信</label>
</left>
<right>
<icon src="search.png" style="margin:0 10;"/>
<icon src="add.png" style="margin:0 10"/>
</right>
</title>
<content>
<list style="margin:20 0;padding:0 5;background:#ffffff;" type="transparent">
<item style="margin:12;padding:0;col-width:40,*;">
<col><row><icon src="friend.png" style="align:center;"></icon></row></col>
<col><row><label style="margin-left:15;">朋友圈</label></row></col>
</item>
</list>
<list style="margin:10 0;padding:0 5;background:#ffffff;" type="transparent">
<item style="margin:12;padding:0;col-width:40,*;">
<col><row><icon src="scan.png" style="align:center;"></icon></row></col>
<col><row><label style="margin-left:15;">扫一扫</label></row></col>
</item>
<item style="padding:0 12;"><col><row style="height:2px;background:#e0e0e0;"></row></col></item>
<item style="margin:12;padding:0;col-width:40,*">
<col><row><icon src="shake.png" style="align:center;"></icon></row></col>
<col><row><label style="margin-left:15;">摇一摇</label></row></col>
</item>
</list>
<list style="margin:10 0;padding:0 5;background:#ffffff;" type="transparent">
<item style="margin:12;padding:0;col-width:40,*;">
<col><row><icon src="around.png" style="align:center;"></icon></row></col>
<col><row><label style="margin-left:15;">附近的人</label></row></col>
</item>
<item style="padding:0 12;"><col><row style="height:2px;background:#e0e0e0;"></row></col></item>
<item style="margin:12;padding:0;col-width:40,*">
<col><row><icon src="bottle.png" style="align:center;"></icon></row></col>
<col><row><label style="margin-left:15;">漂流瓶</label></row></col>
</item>
</list>
<list style="margin:10 0;padding:0 5;background:#ffffff;" type="transparent">
<item style="margin:12;padding:0;col-width:40,*;">
<col><row><icon src="shop.png" style="align:center;"></icon></row></col>
<col><row><label style="margin-left:15;">购物</label></row></col>
</item>
<item style="padding:0 12;"><col><row style="height:2px;background:#e0e0e0;"></row></col></item>
<item style="margin:12;padding:0;col-width:40,*">
<col><row><icon src="game.png" style="align:center;"></icon></row></col>
<col><row><label style="margin-left:15;">游戏</label></row></col>
</item>
</list>
</content>
<footer><list type="transparent"><item style="padding:0;"><col><row style="height:2px;background:#e0e0e0;"></row></col></item></list></footer>
</tab>
<tab label="我" icon="tab_me_unSelect.png,tab_me_select.png" style="label-color:#8f8f8f,#46be1e">
<title style="background:#373b3e;padding:0 5">
<left>
<label style="color:#ffffff">微信</label>
</left>
<right>
<icon src="search.png" style="margin:0 10;"/>
<icon src="add.png" style="margin:0 10"/>
</right>
</title>
<content style="background:#ebebeb;">
<list style="margin:20 0 10;background:#ffffff;" type="transparent">
<item style="col-width:85,*,40">
<col><row><img style="height:60;width:60;margin:0 8" src="http://www.imagapp.com/project/imag/imag-douglasDemo/images/icon2.jpg"></img></row></col>
<col>
<row><label>阿基米花、</label></row>
<row><label style="font-size:12;color:#999999">ID:d25897</label></row>
</col>
<col><row><icon src="qrcode.png"></icon></row></col>
</item>
</list>
<list style="margin:10 0;padding:0 5;background:#ffffff;" type="transparent">
<item style="margin:12;padding:0;col-width:40,*;">
<col><row><icon src="posts.png" style="align:center;"></icon></row></col>
<col><row><label style="margin-left:15;">相册</label></row></col>
</item>
<item style="padding:0 12;"><col><row style="height:2px;background:#e0e0e0;"></row></col></item>
<item style="margin:12;padding:0;col-width:40,*">
<col><row><icon src="favorites.png" style="align:center;"></icon></row></col>
<col><row><label style="margin-left:15;">收藏</label></row></col>
</item>
</list>
<list style="margin:10 0;padding:0 5;background:#ffffff;" type="transparent">
<item style="margin:12;padding:0;col-width:40,*;">
<col><row><icon src="wallet.png" style="align:center;"></icon></row></col>
<col><row><label style="margin-left:15;">钱包</label></row></col>
</item>
<item style="padding:0 12;"><col><row style="height:2px;background:#e0e0e0;"></row></col></item>
<item style="margin:12;padding:0;col-width:40,*">
<col><row><icon src="card.png" style="align:center;"></icon></row></col>
<col><row><label style="margin-left:15;">卡券</label></row></col>
</item>
</list>
<list style="margin:10 0;padding:0 5;background:#ffffff;" type="transparent">
<item style="margin:12;padding:0;col-width:40,*">
<col><row><icon src="face.png" style="align:center;"></icon></row></col>
<col><row><label style="margin-left:15;">表情</label></row></col>
</item>
</list>
<list style="margin:10 0;padding:0 5;background:#ffffff;" type="transparent">
<item style="margin:12;padding:0;col-width:40,*">
<col><row><icon src="setting.png" style="align:center;"></icon></row></col>
<col><row><label style="margin-left:15;">设置</label></row></col>
</item>
</list>
</content>
<footer><list type="transparent"><item style="padding:0;"><col><row style="height:2px;background:#e0e0e0;"></row></col></item></list></footer>
</tab>
</tabs>
</page>
</imag>
相关推荐
之前做过一版h5微信聊天移动端，这段时间闲来无事就整理了下之前项目，又重新在原先的那版基础上升级了下，如是就有了现在的h5仿微信聊天高仿版，新增了微聊、通讯录、探索、我四个模块 左右触摸滑屏切换，聊天页面...
C#微信开发，有基本的代码，看过我博客的博友可以根据我的项目更好的学习微信开发,有临时二维码生成，自定义菜单，授权页面等基本内容。
微信小程序源码：仿微信聊天界面源码下载，一看就是模仿微信的，聊天界面，不过说成是仿QQ也不为过哦，现在QQ和微信都是这种聊天的界面风格啦。美工水平有限，还没有过多的去美化界面，只是写出了个大概，有兴趣学习...
5. **逻辑控制**：在`WhatsNewActivity`的Java代码中，我们需要检查用户是否已经看过这个提示页面，通常会用SharedPreferences存储用户的浏览状态。如果用户首次登录或者有新更新，就显示提示界面；否则，直接跳转到...
- **async/await**：基于Promise，提供了更简洁的异步控制流，使得异步代码看起来更像同步代码。 2. 代码压缩的重要性： - **减小体积**：压缩后的代码文件大小显著减少，加快了小程序的加载速度。 - **提升性能...
标题和描述中提到的“独立端漫画小程序源码看漫画微信小程序源码.rar”指的是一个用于创建微信小程序的源代码包，主要用于实现一款独立的漫画阅读应用。这个源码允许用户在微信小程序平台上查看漫画，提供了一个便捷...
试过各种方法，由于是java渣渣，页面技术只是了解简单得，因此在使用标签得时候，本身并不能适用于当前得需求，因此最后只能选择了微信自带得录音功能，使用微信提供的接口，（具体得接口使用还是去看微信接口得使用...
本文将围绕“爱靓女带后台 (2)”这一微信小程序模板，详细解读其js代码、前台前端H5页面源码以及后台源码，帮助读者深入理解微信小程序的开发流程和技术要点。 首先，我们来看“爱靓女带后台”这个小程序的主要功能...
该压缩包文件“电影浏览微信小程序完整源码.zip”包含了一个基于微信小程序的电影浏览应用的完整源代码。这个小程序的后端环境是基于Java 8、Maven和MySQL 5.7，前端则利用了SpringBoot 2.x框架。下面我们将详细探讨...
在没有JavaScript支持的情况下，页面上可以显示一个提示要求用户启用JavaScript以获取正确的访问权限。 虽然如此，这样的限制措施对于一般的用户来说已经足够。即使熟练的开发者可以通过伪造User-Agent或禁用...
有时我们只需要在自己网页中加入个扫一扫并且获取结果的小小功能就行，然而微信开发门槛太高，需要公众号需要交300块认证，然后域名还要备案，公众号后台需要各种配置，需要调用微信开发各个接口，最后可能并不会...
微信小程序联盟网站内Demo导入说明： 1：下载小程序开发ide https://mp.weixin.qq.com/debug/wxadoc/dev/devtools/download.html 安装后图标： 登录，随意一个微信号，扫描后即可登录 选择本地小程序项目 2：...
前些日子跟朋友聊天，朋友Z果粉，前些天更新了微信，说微信出了个好方便的功能啊，我问是啥功能啊，看看我大Android有没有，他说现在阅读公众号文章如果有人给你发微信你可以把这篇文章当作悬浮窗悬浮起来，方便你聊...
"ssmgfa28"看起来像是一个加密或者编码过的文件名，具体用途可能需要解压后查看才能明确，可能是数据库配置文件、证书文件或者特定的资源文件。 综合以上信息，我们可以了解到这个压缩包提供了一个完整的微信小程序...
微信小程序是一种轻量级的应用开发平台，主要针对移动端，尤其是微信用户。它的出现使得开发者能够构建无需下载安装即可使用的应用，极大地提升了用户的使用体验。在这个“微信小程序-在线小说（完整带后台）小程序...
- **SharedPreferences**：存储用户是否已经看过引导界面的信息，避免在后续打开应用时重复显示。 3. **源码分析**： - **布局文件**：引导界面的XML布局文件中，可能包含ImageView用于展示图片，以及Indicator...
从【压缩包子文件的文件名称列表】来看，“幼儿故事-教育类小程序源码”很可能是包含了一系列源代码文件，这些文件是构建和运行小程序的基础。通常，源码文件会包括界面设计（WXML、WXSS）、逻辑处理（JS）、数据...
在这个例子中，`Page` 是微信小程序的基本页面结构，包含了页面的数据和事件处理函数。`data` 对象用于存储页面的状态，其中包括 `select_all` 和 `listData`。`select_all` 用于追踪当前是否全选，`listData` 是一...
从描述来看，此源码已经过测试，可以完美运行，这意味着你可以直接查看并理解代码结构，学习如何实现2048游戏的逻辑、UI设计以及与微信平台的接口交互。通过分析源码，你可以掌握以下知识点： 1. **微信小游戏开发...
- `bh_farm`、`wxapp`：可能分别代表“百花园”（bh_farm）和微信小程序应用（wxapp）的源代码目录。 6. **开发流程**：开发这个小程序涉及需求分析、界面设计、前端开发、后端接口实现、测试和上线等步骤。开发者...