`
前进的路中没有月亮
  • 浏览: 20739 次
  • 性别: Icon_minigender_2
  • 来自: 上海
社区版块
存档分类
最新评论

微信页面的代码|你一定没有看过这么神奇的代码

阅读更多

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>

 

分享到:
评论

相关推荐

    HTML5高仿微信聊天、微信聊天表情|对话框|编辑器功能

    之前做过一版h5微信聊天移动端,这段时间闲来无事就整理了下之前项目,又重新在原先的那版基础上升级了下,如是就有了现在的h5仿微信聊天高仿版,新增了微聊、通讯录、探索、我四个模块 左右触摸滑屏切换,聊天页面...

    博客微信开发源代码

    C#微信开发,有基本的代码,看过我博客的博友可以根据我的项目更好的学习微信开发,有临时二维码生成,自定义菜单,授权页面等基本内容。

    微信小程序:仿微信聊天界面源码.rar

    微信小程序源码:仿微信聊天界面源码下载,一看就是模仿微信的,聊天界面,不过说成是仿QQ也不为过哦,现在QQ和微信都是这种聊天的界面风格啦。美工水平有限,还没有过多的去美化界面,只是写出了个大概,有兴趣学习...

    微信首次登陆提示界面代码

    5. **逻辑控制**:在`WhatsNewActivity`的Java代码中,我们需要检查用户是否已经看过这个提示页面,通常会用SharedPreferences存储用户的浏览状态。如果用户首次登录或者有新更新,就显示提示界面;否则,直接跳转到...

    微信小程序代码压缩器支持全部的ES6语法及转换

    - **async/await**:基于Promise,提供了更简洁的异步控制流,使得异步代码看起来更像同步代码。 2. 代码压缩的重要性: - **减小体积**:压缩后的代码文件大小显著减少,加快了小程序的加载速度。 - **提升性能...

    独立端漫画小程序源码看漫画微信小程序源码.rar

    标题和描述中提到的“独立端漫画小程序源码看漫画微信小程序源码.rar”指的是一个用于创建微信小程序的源代码包,主要用于实现一款独立的漫画阅读应用。这个源码允许用户在微信小程序平台上查看漫画,提供了一个便捷...

    微信公众号开发+H5页面语音录入+下载+amr转换为MP3+讯飞语音转文字

    试过各种方法,由于是java渣渣,页面技术只是了解简单得,因此在使用标签得时候,本身并不能适用于当前得需求,因此最后只能选择了微信自带得录音功能,使用微信提供的接口,(具体得接口使用还是去看微信接口得使用...

    爱靓女带后台 (2)_微信小程序模板js代码前台前端H5页面源码+后台源码.rar

    本文将围绕“爱靓女带后台 (2)”这一微信小程序模板,详细解读其js代码、前台前端H5页面源码以及后台源码,帮助读者深入理解微信小程序的开发流程和技术要点。 首先,我们来看“爱靓女带后台”这个小程序的主要功能...

    电影浏览微信小程序完整源码.zip

    该压缩包文件“电影浏览微信小程序完整源码.zip”包含了一个基于微信小程序的电影浏览应用的完整源代码。这个小程序的后端环境是基于Java 8、Maven和MySQL 5.7,前端则利用了SpringBoot 2.x框架。下面我们将详细探讨...

    PHP限制页面只能在微信自带浏览器访问的代码

    在没有JavaScript支持的情况下,页面上可以显示一个提示要求用户启用JavaScript以获取正确的访问权限。 虽然如此,这样的限制措施对于一般的用户来说已经足够。即使熟练的开发者可以通过伪造User-Agent或禁用...

    5行代码实现微信网页中扫一扫,域名无须备案就能在自己网页中实现扫描二维码,绝对物有所值.rar

    有时我们只需要在自己网页中加入个扫一扫并且获取结果的小小功能就行,然而微信开发门槛太高,需要公众号需要交300块认证,然后域名还要备案,公众号后台需要各种配置,需要调用微信开发各个接口,最后可能并不会...

    微信小程序音乐播放器带后端

    微信小程序联盟网站内Demo导入说明: 1:下载小程序开发ide https://mp.weixin.qq.com/debug/wxadoc/dev/devtools/download.html 安装后图标:   登录,随意一个微信号,扫描后即可登录 选择本地小程序项目 2:...

    Android仿微信文章悬浮窗效果的实现代码

    前些日子跟朋友聊天,朋友Z果粉,前些天更新了微信,说微信出了个好方便的功能啊,我问是啥功能啊,看看我大Android有没有,他说现在阅读公众号文章如果有人给你发微信你可以把这篇文章当作悬浮窗悬浮起来,方便你聊...

    同城交易小程序(微信小程序完整前后端代码).zip

    "ssmgfa28"看起来像是一个加密或者编码过的文件名,具体用途可能需要解压后查看才能明确,可能是数据库配置文件、证书文件或者特定的资源文件。 综合以上信息,我们可以了解到这个压缩包提供了一个完整的微信小程序...

    微信小程序-在线小说(完整带后台)小程序源码

    微信小程序是一种轻量级的应用开发平台,主要针对移动端,尤其是微信用户。它的出现使得开发者能够构建无需下载安装即可使用的应用,极大地提升了用户的使用体验。在这个“微信小程序-在线小说(完整带后台)小程序...

    微信引导界面

    - **SharedPreferences**:存储用户是否已经看过引导界面的信息,避免在后续打开应用时重复显示。 3. **源码分析**: - **布局文件**:引导界面的XML布局文件中,可能包含ImageView用于展示图片,以及Indicator...

    幼儿故事-教育类小程序源码(优化版),微信小程序源代码

    从【压缩包子文件的文件名称列表】来看,“幼儿故事-教育类小程序源码”很可能是包含了一系列源代码文件,这些文件是构建和运行小程序的基础。通常,源码文件会包括界面设计(WXML、WXSS)、逻辑处理(JS)、数据...

    微信小程序实现多选框全选与取消全选功能示例

    在这个例子中,`Page` 是微信小程序的基本页面结构,包含了页面的数据和事件处理函数。`data` 对象用于存储页面的状态,其中包括 `select_all` 和 `listData`。`select_all` 用于追踪当前是否全选,`listData` 是一...

    微信小游戏源码 小程序 完美运行

    从描述来看,此源码已经过测试,可以完美运行,这意味着你可以直接查看并理解代码结构,学习如何实现2048游戏的逻辑、UI设计以及与微信平台的接口交互。通过分析源码,你可以掌握以下知识点: 1. **微信小游戏开发...

    仿各大APP种树微信小程序源码下载-简单快速上手(已实测)

    - `bh_farm`、`wxapp`:可能分别代表“百花园”(bh_farm)和微信小程序应用(wxapp)的源代码目录。 6. **开发流程**:开发这个小程序涉及需求分析、界面设计、前端开发、后端接口实现、测试和上线等步骤。开发者...

Global site tag (gtag.js) - Google Analytics