Merge pull request #276 from lwYU/master

#2 #157 第二次实验代码
hzuapps · Nov 7, 2017 · 61ecd46 · 61ecd46
2 parents a8f75d0 + 7092655
commit 61ecd46
Show file tree

Hide file tree

Showing 6 changed files with 119 additions and 33 deletions.
diff --git a/1514080901111/app.json b/1514080901111/app.json
@@ -6,7 +6,7 @@
   "window":{
     "backgroundTextStyle":"light",
     "navigationBarBackgroundColor": "#fff",
-    "navigationBarTitleText": "笑话精选",
+    "navigationBarTitleText": "WeChat",
     "navigationBarTextStyle":"black"
   }
 }
diff --git a/1514080901111/app.wxss b/1514080901111/app.wxss
@@ -1,4 +1,5 @@
 /**app.wxss**/
+ @import"weui.wxss";
 .container {
   height: 100%;
   display: flex;

diff --git a/1514080901111/pages/index/index.js b/1514080901111/pages/index/index.js
@@ -52,3 +52,4 @@ Page({
     })
   }
 })
+Page({});
diff --git a/1514080901111/pages/index/index.wxml b/1514080901111/pages/index/index.wxml
@@ -1,13 +1,89 @@
-<!--index.wxml-->
-<view class="container">
-  <view class="userinfo">
-    <button wx:if="{{!hasUserInfo && canIUse}}" open-type="getUserInfo" bindgetuserinfo="getUserInfo"> 获取头像昵称 </button>
-    <block wx:else>
-      <image bindtap="bindViewTap" class="userinfo-avatar" src="{{userInfo.avatarUrl}}" background-size="cover"></image>
-      <text class="userinfo-nickname">{{userInfo.nickName}}</text>
-    </block>
-  </view>
-  <view class="usermotto">
-    <text class="user-motto">{{motto}}</text>
-  </view>
+<view class="page">
+    <view class="page__hd">
+        <view class="page__title">SearchBar</view>
+        <view class="page__desc">搜索栏</view>
+    </view>
+    <view class="page__bd">
+        <view class="weui-search-bar">
+            <view class="weui-search-bar__form">
+                <view class="weui-search-bar__box">
+                    <icon class="weui-icon-search_in-box" type="search" size="14"></icon>
+                    <input type="text" class="weui-search-bar__input" placeholder="搜索" value="{{inputVal}}" focus="{{inputShowed}}" bindinput="inputTyping" />
+                    <view class="weui-icon-clear" wx:if="{{inputVal.length > 0}}" bindtap="clearInput">
+                        <icon type="clear" size="14"></icon>
+                    </view>
+                </view>
+                <label class="weui-search-bar__label" hidden="{{inputShowed}}" bindtap="showInput">
+                    <icon class="weui-icon-search" type="search" size="14"></icon>
+                    <view class="weui-search-bar__text">搜索</view>
+                </label>
+            </view>
+            <view class="weui-search-bar__cancel-btn" hidden="{{!inputShowed}}" bindtap="hideInput">取消</view>
+        </view>
+        <view class="weui-cells searchbar-result" wx:if="{{inputVal.length > 0}}">
+            <navigator url="" class="weui-cell" hover-class="weui-cell_active">
+                <view class="weui-cell__bd">
+                    <view>实时搜索文本</view>
+                </view>
+            </navigator>
+            <navigator url="" class="weui-cell" hover-class="weui-cell_active">
+                <view class="weui-cell__bd">
+                    <view>实时搜索文本</view>
+                </view>
+            </navigator>
+            <navigator url="" class="weui-cell" hover-class="weui-cell_active">
+                <view class="weui-cell__bd">
+                    <view>实时搜索文本</view>
+                </view>
+            </navigator>
+            <navigator url="" class="weui-cell" hover-class="weui-cell_active">
+                <view class="weui-cell__bd">
+                    <view>实时搜索文本</view>
+                </view>
+            </navigator>
+        </view>
+    </view>
 </view>
+<view class="page">
+    <view class="page__hd">
+        <view class="page__title">Progress</view>
+        <view class="page__desc">进度条，这里采用小程序原生的progress</view>
+    </view>
+    <view class="page__bd page__bd_spacing">
+        <view class="weui-progress">
+            <view class="weui-progress__bar">
+                <progress percent="0" stroke-width="3" />
+            </view>
+            <view class="weui-progress__opr">
+                <icon type="cancel" size="22"></icon>
+            </view>
+        </view>
+        <view class="weui-progress">
+            <view class="weui-progress__bar">
+                <progress percent="50" stroke-width="3" />
+            </view>
+            <view class="weui-progress__opr">
+                <icon type="cancel" size="22"></icon>
+            </view>
+        </view>
+        <view class="weui-progress">
+            <view class="weui-progress__bar">
+                <progress percent="80" stroke-width="3" />
+            </view>
+            <view class="weui-progress__opr">
+                <icon type="cancel" size="22"></icon>
+            </view>
+        </view>
+        <view class="weui-progress">
+            <view class="weui-progress__bar">
+                <progress percent="{{progress}}" stroke-width="3" />
+            </view>
+            <view class="weui-progress__opr">
+                <icon type="cancel" size="22"></icon>
+            </view>
+        </view>
+        <view class="weui-btn-area">
+            <button type="primary" bindtap="upload" disabled="{{disabled}}">上传</button>
+        </view>
+    </view>
+</view>
diff --git a/1514080901111/pages/index/index.wxss b/1514080901111/pages/index/index.wxss
@@ -1,21 +1,23 @@
-/**index.wxss**/
-.userinfo {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-}
+/*!
+ * WeUI v1.1.1 (https://github.com/weui/weui-wxss)
+ * Copyright 2017 Tencent, Inc.
+ * Licensed under the MIT license
+ */
 
-.userinfo-avatar {
-  width: 128rpx;
-  height: 128rpx;
-  margin: 20rpx;
-  border-radius: 50%;
-}
-
-.userinfo-nickname {
-  color: #aaa;
-}
-
-.usermotto {
-  margin-top: 200px;
-}
+/*!
+ * WeUI v1.1.1 (https://github.com/weui/weui-wxss)
+ * Copyright 2017 Tencent, Inc.
+ * Licensed under the MIT license
+ */
+/*!
+ * WeUI v1.1.1 (https://github.com/weui/weui-wxss)
+ * Copyright 2017 Tencent, Inc.
+ * Licensed under the MIT license
+ */
+.weui-search-bar{position:relative;padding:8px 10px;display:-webkit-box;display:-webkit-flex;display:flex;box-sizing:border-box;background-color:#efeff4;border-top:1rpx solid #d7d6dc;border-bottom:1rpx solid #d7d6dc}.weui-icon-search{margin-right:8px;font-size:inherit}.weui-icon-search_in-box{position:absolute;left:10px;top:7px}.weui-search-bar__text{display:inline-block;font-size:14px;vertical-align:middle}.weui-search-bar__form{position:relative;-webkit-box-flex:1;-webkit-flex:auto;flex:auto;border-radius:5px;background:#fff;border:1rpx solid #e6e6ea}.weui-search-bar__box{position:relative;padding-left:30px;padding-right:30px;width:100%;box-sizing:border-box;z-index:1}.weui-search-bar__input{height:28px;line-height:28px;font-size:14px}.weui-icon-clear{position:absolute;top:0;right:0;padding:7px 8px;font-size:0}.weui-search-bar__label{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;border-radius:3px;text-align:center;color:#9b9b9b;background:#fff;line-height:28px}.weui-search-bar__cancel-btn{margin-left:10px;line-height:28px;color:#09bb07;white-space:nowrap}
+/*!
+ * WeUI v1.1.1 (https://github.com/weui/weui-wxss)
+ * Copyright 2017 Tencent, Inc.
+ * Licensed under the MIT license
+ */
+.weui-progress{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center}.weui-progress__bar{-webkit-box-flex:1;-webkit-flex:1;flex:1}.weui-progress__opr{margin-left:15px;font-size:0}
-Original file line number
+Diff line change
@@ Expand Up / @@ -52,3 +52,4 @@ Page({ @@
         })
       }
     })
+    Page({});