From 1845031541edf192625474dccc827cb0a4c7b3b4 Mon Sep 17 00:00:00 2001
From: "moxun.ljf" <furmint@foxmail.com>
Date: Mon, 27 Mar 2017 19:57:58 +0800
Subject: [PATCH 1/2] * [android] accept 0 value as height or width

---
 .../src/main/java/com/taobao/weex/dom/flex/LayoutEngine.java  | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/android/sdk/src/main/java/com/taobao/weex/dom/flex/LayoutEngine.java b/android/sdk/src/main/java/com/taobao/weex/dom/flex/LayoutEngine.java
index 6c5eba0375..5341bf56ce 100755
--- a/android/sdk/src/main/java/com/taobao/weex/dom/flex/LayoutEngine.java
+++ b/android/sdk/src/main/java/com/taobao/weex/dom/flex/LayoutEngine.java
@@ -104,8 +104,10 @@ private static void setDimensionFromStyle(CSSNode node, int axis) {
       return;
     }
     // We only run if there's a width or height defined
+    // modify by moxun.ljf on 17/03/27
+    // 0.0 should be a legal value, it is usually used to hide an element on the page
     if (Float.isNaN(node.cssstyle.dimensions[dim[axis]]) ||
-        node.cssstyle.dimensions[dim[axis]] <= 0.0) {
+        node.cssstyle.dimensions[dim[axis]] < 0.0) {
       return;
     }
 

From 0f8dd7657d2a63753422f6f594344f9bfa97c381 Mon Sep 17 00:00:00 2001
From: "moxun.ljf" <moxun.ljf@alibaba-inc.com>
Date: Fri, 24 Mar 2017 14:24:02 +0800
Subject: [PATCH 2/2] * [android] revert the other changes that not belong to
 this feature (cherry picked from commit 312f592)

---
 examples/component/list/list-basic.we | 75 ++++++++-------------------
 examples/component/scroller-demo.we   | 64 +++++++----------------
 2 files changed, 42 insertions(+), 97 deletions(-)

diff --git a/examples/component/list/list-basic.we b/examples/component/list/list-basic.we
index 37f9c252b0..f7e0efc4f9 100644
--- a/examples/component/list/list-basic.we
+++ b/examples/component/list/list-basic.we
@@ -1,15 +1,8 @@
 <template>
   <div>
-    <div style="background-color: #eeeeee">
-      <text class="count">Appear items:{{appearMin}} - {{appearMax}}</text>
-      <div style="height: 20px;width: 750px;border-color: black;border-width: 2px;justify-content: center">
-        <div style="height: 14px;width: {{progress_width}};margin-left:{{progress}};background-color: gray"></div>
-      </div>
-      <text style="width: 750px">{{event}}</text>
-    </div>
-    <list id="list" class="list" onscroll="{{onScroll}}" offset-accuracy="5">
-      <refresh class="refresh-view" display="{{refresh_display}}" onrefresh="onrefresh">
-        <text if="{{(refresh_display==='hide')}}"> ↓ pull to refresh</text>
+    <list class="list">
+      <refresh  class = "refresh-view" display="{{refresh_display}}" onrefresh="onrefresh">
+        <text if="{{(refresh_display==='hide')}}"> ↓ pull to refresh </text>
         <loading-indicator class="indicator"></loading-indicator>
       </refresh>
       <cell onappear="onappear" ondisappear="ondisappear" class="row" repeat="{{rows}}" index="{{$index}}">
@@ -18,27 +11,26 @@
         </div>
       </cell>
       <loading class="loading-view" display="{{loading_display}}" onloading="onloading">
-        <text if="{{(loading_display==='hide')}}">↑ Loadmore</text>
+        <text if="{{(loading_display==='hide')}}">↑ Loadmore </text>
         <loading-indicator class="indicator"></loading-indicator>
       </loading>
     </list>
+    <text class="count">Appear items:{{appearMin}} - {{appearMax}}</text>
   </div>
 </template>
 
 <style>
   .list {
-
+    height:850
   }
-
   .count {
     font-size: 48;
-    margin: 10;
+    margin:10;
   }
-
   .indicator {
     height: 40;
     width: 40;
-    color: #45b5f0;
+    color:#45b5f0;
   }
 
   .refresh-arrow {
@@ -49,18 +41,16 @@
   .row {
     width: 750;
   }
-
+  
   .item {
     justify-content: center;
     border-bottom-width: 2;
     border-bottom-color: #c0c0c0;
     height: 100;
-    padding: 20;
+    padding:20;
   }
-
   .item-title {
   }
-
   .refresh-view {
     width: 750;
     height: 100;
@@ -72,7 +62,6 @@
     -webkit-box-align: center;
     align-items: center;
   }
-
   .loading-view {
     width: 750;
     height: 100;
@@ -84,7 +73,6 @@
     -webkit-box-align: center;
     align-items: center;
   }
-
   .indicator {
     height: 60;
     width: 60;
@@ -93,8 +81,7 @@
 </style>
 
 <script>
-  var dom = weex.requireModule('dom');
-  var isFirst = true;
+
   module.exports = {
     methods: {
       onappear: function (e) {
@@ -104,7 +91,7 @@
         appearIds.push(appearId);
         this.getMinAndMaxIds(appearIds);
       },
-      ondisappear: function (e) {
+      ondisappear:function (e) {
         var disAppearId = this.rows[e.target.attr.index].id;
         nativeLog('+++++', disAppearId);
         var appearIds = this.appearIds;
@@ -114,15 +101,15 @@
         }
         this.getMinAndMaxIds(appearIds);
       },
-      getMinAndMaxIds: function (appearIds) {
-        appearIds.sort(function (a, b) {
+      getMinAndMaxIds:function (appearIds) {
+        appearIds.sort(function(a, b) {
           return a - b;
         });
         this.appearIds = appearIds;
         this.appearMax = appearIds[appearIds.length - 1];
         this.appearMin = appearIds[0];
       },
-      onrefresh: function (e) {
+      onrefresh: function(e) {
         var self = this;
         self.refresh_display = 'show';
         self.$call('modal', 'toast', {
@@ -134,7 +121,7 @@
         }, 3000);
       },
 
-      onloading: function () {
+      onloading: function() {
         var self = this;
         self.loading_display = 'show';
         self.$call('modal', 'toast', {
@@ -143,37 +130,19 @@
 
         this.$call('timer', 'setTimeout', function () {
           if (self.rows.length <= 33) {
-            self.rows.push(self.moreRows[self.rows.length - 29]);
-          }
+              self.rows.push(self.moreRows[self.rows.length - 29]);
+            }
           self.loading_display = 'hide';
         }, 3000);
       },
-
-      onScroll: function (e) {
-        var self = this;
-        this.event = 'contentOffset: ' + JSON.stringify(e.contentOffset) + '\ncontentSize: ' + JSON.stringify(e.contentSize);
-        dom.getComponentRect(this.$el('list'), function (ret) {
-          if (e.contentOffset.x == 0 && e.contentOffset.y == 0 && isFirst) {
-            isFirst = false;
-            return;
-          }
-          var listHeight = ret.size.height;
-          self.progress_width = (listHeight / e.contentSize.height) * 750;
-          var offsetY = e.contentOffset.y > 0 ? 0 : Math.abs(e.contentOffset.y);
-          self.progress = (offsetY / (e.contentSize.height - listHeight)) * (750 - self.progress_width);
-        });
-      }
     },
     data: {
-      progress_width: 0,
-      progress:0,
-      event:'-',
       refresh_display: 'hide',
       loading_display: 'hide',
-      appearMin: 1,
-      appearMax: 1,
-      appearIds: [],
-      rows: [
+      appearMin:1,
+      appearMax:1,
+      appearIds:[],
+      rows:[
         {id: 1},
         {id: 2},
         {id: 3},
diff --git a/examples/component/scroller-demo.we b/examples/component/scroller-demo.we
index a484bb00b4..750fd782ba 100644
--- a/examples/component/scroller-demo.we
+++ b/examples/component/scroller-demo.we
@@ -1,34 +1,25 @@
 <template>
-  <div>
-    <div style="height: 20px;width: 750px;border-color: black;border-width: 2px;justify-content: center">
-      <div style="height: 14px;width: {{progress_width}};margin-left:{{progress}};background-color: gray"></div>
-    </div>
-    <text style="width: 750px">{{event}}</text>
-
-    <scroller id="scroller" onscroll="{{onScroll}}">
+  <scroller class="list" append="tree">
 
-      <refresh class="refresh-view" display="{{refresh_display}}" onrefresh="onrefresh">
-        <loading-indicator class="indicator"></loading-indicator>
-        <text class="refresh-arrow" style="text-align: center; color:rgb(238, 162, 54)"
-              if="{{(refresh_display==='hide')}}">Pull To Refresh
-        </text>
-      </refresh>
+    <refresh class="refresh-view" display="{{refresh_display}}" onrefresh="onrefresh">
+      <loading-indicator class="indicator" ></loading-indicator>
+      <text class="refresh-arrow" style="text-align: center; color:rgb(238, 162, 54)" if="{{(refresh_display==='hide')}}">Pull To Refresh</text>
+    </refresh>
 
-      <div class="section" repeat="{{sections}}">
-        <div class="header">
-          <text class="header-title">{{title}}</text>
-        </div>
-        <div class="item" repeat="{{items}}">
-          <text class="item-title">row {{id}}</text>
-        </div>
+    <div class="section" repeat="{{sections}}">
+      <div class="header">
+        <text class="header-title">{{title}}</text>
       </div>
+      <div class="item" repeat="{{items}}">
+        <text class="item-title">row {{id}}</text>
+      </div>
+    </div>
 
-      <loading class="loading-view" display="{{loading_display}}" onloading="onloading">
-        <loading-indicator class="indicator"></loading-indicator>
-      </loading>
+    <loading class="loading-view" display="{{loading_display}}" onloading="onloading">
+      <loading-indicator class="indicator" ></loading-indicator>
+    </loading>
 
-    </scroller>
-  </div>
+  </scroller>
 </template>
 
 <style>
@@ -94,48 +85,33 @@
 
 <script>
   require('weex-components');
-  var dom = weex.requireModule('dom');
   module.exports = {
     methods: {
-      onrefresh: function (e) {
+      onrefresh: function(e) {
         var self = this;
         self.refresh_display = 'show';
         self.$call('modal', 'toast', {
           'message': 'onrefresh'
         });
-        this.$call('timer', 'setTimeout', function () {
+        this.$call('timer', 'setTimeout', function() {
           self.refresh_display = 'hide';
         }, 3000);
       },
-      onloading: function (e) {
+      onloading: function(e) {
         var self = this;
         self.loading_display = 'show';
         self.$call('modal', 'toast', {
           'message': 'onloading'
         });
-        this.$call('timer', 'setTimeout', function () {
+        this.$call('timer', 'setTimeout', function() {
           if (self.sections.length <= 6) {
             self.sections.push(self.moreSections[self.sections.length - 2]);
           }
           self.loading_display = 'hide';
         }, 3000);
-      },
-      onScroll: function (e) {
-        var self = this;
-        this.event = 'contentOffset: ' + JSON.stringify(e.contentOffset) + '\ncontentSize: ' + JSON.stringify(e.contentSize);
-        dom.getComponentRect(this.$el('scroller'), function (ret) {
-          console.log(ret.size.height);
-          var listHeight = ret.size.height;
-          self.progress_width = (listHeight / e.contentSize.height) * 750;
-          var offsetY = e.contentOffset.y > 0 ? 0 : Math.abs(e.contentOffset.y);
-          self.progress = (offsetY / (e.contentSize.height - listHeight)) * (750 - self.progress_width);
-        });
       }
     },
     data: {
-      event: '-',
-      progress_width: 0,
-      progress:0,
       refresh_display: 'hide',
       loading_display: 'hide',
       sections: [