@shijiu/jsview-vue 0.9.684 → 0.9.766

package/utils/JsViewEngineWidget/MetroWidget/MetroWidget.vue

@@ -2,7 +2,7 @@
  * @Author: ChenChanghua
  * @Date: 2021-09-22 16:08:58
  * @LastEditors: ChenChanghua
- * @LastEditTime: 2022-11-07 15:51:14
+ * @LastEditTime: 2022-12-19 11:17:10
  * @Description: file content
 -->
 
@@ -23,7 +23,13 @@
  *      name {string} 用于设置焦点的名称
  *      padding {object} 控件内边距， 默认为{left: 0, right: 0, top: 0, bottom: 0}
  *      direction {enum} (必选)控件方向 HORIZONTAL/VERTICAL
- *      loopFocus {boolean} 焦点到边界后自动转到下一行，默认false
+ *      focusMoveType {int} 焦点移动的模式, 可通过 | 运算进行组合
+                          NO_ADJUST: 无特殊处理
+                          COLUMN_LOOP: 到达列首/尾后跳转到上/下一列, 只在水平滚动时生效
+                          ROW_LOOP: 到达行首/尾后跳转到上/下一行, 只在竖直滚动时生效
+                          COLUMN_FIND_NEAR: 一列中没有下一个元素时是否跳转到相邻列
+                          ROW_FIND_NEAR: 一行中没有下一个元素时是否跳转到相邻行
+
  *      initFocusId {int} 初始焦点，默认为0
  *      slideSetting {SlideSetting} 页面滑动的设置, 目前SlideSetting有三个子类, 具体见 WidgetCommon 中的说明
                                     WholePageSlide
@@ -80,6 +86,7 @@
  *      loadAll {boolean} 加载不显示的view，触控场景使用
  *      flingPageWidth {}
  *      flingPageEdge {}
+ *      disableClip {boolean} 取消显示范围的clipView
  *    methods:
         getFocusBlockRef 获取此MetroWidget的 jsv-focus-block句柄，可以使用requestFocus完成获焦
 
@@ -397,6 +404,14 @@ const props = defineProps({
   onScroll: {
     type: Function,
   },
+  focusMoveType: {
+    type: Number,
+    default: 0,
+  },
+  disableClip: {
+    type: Boolean,
+    default: false,
+  },
 });
 
 let dataUpdateToken = ref(0);
@@ -423,7 +438,7 @@ let itemRender = ref(!props.enableItemRenderBreak);
 let permanentItemList = [];
 let preUpdateVisibleStart = 0;
 let mounted = false;
-let focusNode = ref(null);
+let focusNode = shallowRef(null);
 let pageRange = vertical ? props.height : props.width;
 
 let slideLock = false;
@@ -464,8 +479,8 @@ let visibleInfo = {
   },
 };
 
-let locateDiv = ref(null);
-let slideDiv = ref(null);
+let locateDiv = shallowRef(null);
+let slideDiv = shallowRef(null);
 let renderData = shallowRef([]);
 let slideDivLeft = ref(0);
 let slideDivTop = ref(0);
@@ -483,7 +498,7 @@ const _onFocusChange = (id) => {
 const _getCurrentId = () => {
   return {
     id: focusId,
-    index: templateParser.FocusIdToIndex(focusId),
+    index: templateParser.IdToIndex(focusId),
   };
 };
 
@@ -563,7 +578,7 @@ const setFocusId = (id, needSlide = true, doAnim = false, extraSetting) => {
   let next_focus_item = templateParser.GetItemById(id);
   if (next_focus_item) {
     if (needSlide) {
-      slideToItem(templateParser.FocusIdToIndex(id), doAnim);
+      slideToItem(templateParser.IdToIndex(id), doAnim);
     }
     let unlock = null;
     if (extraSetting) {
@@ -589,8 +604,8 @@ const setFocusId = (id, needSlide = true, doAnim = false, extraSetting) => {
     };
     _updateBlurItem();
     _updateFocusItem();
-    onItemBlur(templateParser.FocusIdToIndex(preFocusId));
-    onItemFocus(templateParser.FocusIdToIndex(focusId), preEdgeRect);
+    onItemBlur(templateParser.IdToIndex(preFocusId));
+    onItemFocus(templateParser.IdToIndex(focusId), preEdgeRect);
     unlock?.();
   }
 };
@@ -797,7 +812,7 @@ const refreshData = (force_update) => {
   dataUpdateToken.value++;
   pageUpdater.apply();
   _updateFocusItem();
-  onItemFocus(templateParser.FocusIdToIndex(focusId), null);
+  onItemFocus(templateParser.IdToIndex(focusId), null);
   if (needSlide) {
     _slideTo(visibleInfo.start, null);
   } else if (need_update_content) {
@@ -1053,7 +1068,7 @@ const onKeyDown = (ev) => {
       _moveToNext(horizontal_direction, vertical_direction);
       break;
     case 13:
-      onItemClick(templateParser.FocusIdToIndex(focusId));
+      onItemClick(templateParser.IdToIndex(focusId));
       break;
     default:
       //只接受上下左右确定键
@@ -1093,7 +1108,7 @@ const _onTemplateAdd = (item) => {
         this.slotMounted.value = true;
         if (callFocusAfterUpdate && this.data.id === focusId) {
           nextTick(() => {
-            onItemFocus(templateParser.FocusIdToIndex(focusId), preEdgeRect);
+            onItemFocus(templateParser.IdToIndex(focusId), preEdgeRect);
           });
           callFocusAfterUpdate = false;
         }
@@ -1198,7 +1213,9 @@ const _onCustomerEvent = (ev) => {
       yPos: item_layout.top,
       width: item_layout.width,
       height: item_layout.height,
-      index: templateParser.FocusIdToIndex(focusId),
+      centerYPos: Math.floor(item_layout.top + item_layout.height / 2),
+      centerXPos: Math.floor(item_layout.left + item_layout.width / 2),
+      index: templateParser.IdToIndex(focusId),
     };
 
     let cur_slide = _calculateVisibleStart(obj, direction);
@@ -1244,15 +1261,14 @@ const _moveToNext = (
   item_edge_rect
 ) => {
   let cur_focus_item = templateParser.GetItemById(focusId);
-  let next_item_id = templateParser.GetNextItem(
+  let next_focus_item = templateParser.GetNextItem(
     focusId,
     vertical_direction,
     horizontal_direction,
-    props.loopFocus
+    props.focusMoveType
   );
-  if (next_item_id >= 0) {
+  if (next_focus_item !== null) {
     preFocusId = focusId;
-    let next_focus_item = templateParser.GetItemById(next_item_id);
     templateItemAdder.tryAddItem(next_focus_item, 1);
     focusId = next_focus_item.id;
 
@@ -1261,8 +1277,7 @@ const _moveToNext = (
 
     let cur_visible_start = _calculateVisibleStart(next_focus_item, direction);
     if (
-      !innerData[templateParser.FocusIdToIndex(next_item_id)].itemConfig
-        ?.takeOverSlide &&
+      !innerData[templateParser.IdToIndex(focusId)].itemConfig?.takeOverSlide &&
       visibleInfo.start !== cur_visible_start
     ) {
       if (next_focus_item.doSlide) {
@@ -1284,7 +1299,7 @@ const _moveToNext = (
               1,
             visibleInfo.endWithPadding + props.keepTraceRange * pageRange
           ),
-          next_item_id,
+          next_focus_item.id,
           false,
           permanentItemList
         );
@@ -1294,7 +1309,7 @@ const _moveToNext = (
           templateParser,
           cur_visible_start,
           cur_visible_start + visibleInfo.range + visibleInfo.padding.end - 1,
-          next_item_id,
+          next_focus_item.id,
           false,
           permanentItemList
         );
@@ -1333,8 +1348,8 @@ const _moveToNext = (
     preEdgeRect = rect;
     _updateBlurItem();
     _updateFocusItem();
-    onItemBlur(templateParser.FocusIdToIndex(preFocusId));
-    onItemFocus(templateParser.FocusIdToIndex(focusId), preEdgeRect);
+    onItemBlur(templateParser.IdToIndex(preFocusId));
+    onItemFocus(templateParser.IdToIndex(focusId), preEdgeRect);
   } else {
     let x_off_set = props.direction === VERTICAL ? 0 : visibleInfo.start;
     let y_off_set = props.direction === VERTICAL ? visibleInfo.start : 0;
@@ -1358,7 +1373,7 @@ const _moveToNext = (
       height: cur_focus_item.height,
     };
     props.onEdge?.({ direction: edge, rect: rect });
-    innerData[templateParser.FocusIdToIndex(focusId)].callbacks.onWidgetEdge?.({
+    innerData[templateParser.IdToIndex(focusId)].callbacks.onWidgetEdge?.({
       direction: edge,
     });
   }
@@ -1384,9 +1399,17 @@ const _calculateVisibleStart = (target_item, direction) => {
       );
       break;
     case SlideSetting.Type.WHOLE_PAGE:
-      new_visible_start = templateParser.GetItem(target_item.pageHeadIndex)[
-        pos_key
-      ];
+      if (typeof target_item.pageHeadIndex == "undefined") {
+        //TODO 子控制滚动时whole page滚动
+        console.error(
+          "child controlled whole page slide type is not supported."
+        );
+      } else {
+        new_visible_start = templateParser.GetItem(target_item.pageHeadIndex)[
+          pos_key
+        ];
+      }
+
       break;
     case SlideSetting.Type.SEAMLESS:
       if (
@@ -1533,7 +1556,7 @@ const _onFocus = (params) => {
   enterFocusId = -1;
   enterFocusRect = null;
   _updateFocusItem();
-  onItemFocus(templateParser.FocusIdToIndex(focusId), preEdgeRect);
+  onItemFocus(templateParser.IdToIndex(focusId), preEdgeRect);
   props.onFocus?.();
 };
 
@@ -1547,7 +1570,7 @@ const _onBlur = () => {
   }
   preFocusId = focusId;
   _updateBlurItem();
-  innerData[templateParser.FocusIdToIndex(preFocusId)].callbacks.onBlur();
+  innerData[templateParser.IdToIndex(preFocusId)].callbacks.onBlur();
 
   props.onBlur?.();
 };
@@ -1560,11 +1583,11 @@ const _onSlideEnd = (event) => {
 };
 
 const _updateFocusItem = () => {
-  _setZIndex(templateParser.FocusIdToIndex(focusId), innerData.length, true);
+  _setZIndex(templateParser.IdToIndex(focusId), innerData.length, true);
 };
 
 const _updateBlurItem = () => {
-  _setZIndex(templateParser.FocusIdToIndex(preFocusId), 0, false);
+  _setZIndex(templateParser.IdToIndex(preFocusId), 0, false);
 };
 
 const _updateFocusByDragInfo = (viewX, viewY) => {
@@ -1712,8 +1735,8 @@ const _onScroll = () => {
 const _updatePosition = (x, y, anim_info) => {
   if (slideLock) return;
   if (toRaw(slideDiv.value)) {
-    let pre_left = toRaw(slideDiv.value).style.left,
-      pre_top = toRaw(slideDiv.value).style.top;
+    let pre_left = slideDivLeft.value,
+      pre_top = slideDivTop.value;
     //jsvMaskView的位置更新时会被设置位0，因此不能通过ResetLayoutParams设置位置
     slideDivLeft.value = x;
     slideDivTop.value = y;
@@ -1734,7 +1757,9 @@ const _updatePosition = (x, y, anim_info) => {
       slide_animation.SetAnimationListener(
         new Forge.AnimationListener(anim_info.onstart, anim_info.onend, null)
       );
-      toRaw(slideDiv.value).jsvMaskView.StartAnimation(slide_animation);
+      toRaw(slideDiv.value)
+        .jsvGetProxyView(true)
+        .StartAnimation(slide_animation);
     }
     _onScroll();
   }
@@ -1742,7 +1767,7 @@ const _updatePosition = (x, y, anim_info) => {
 
 const _initRootTouch = () => {
   if (props.enableTouch && toRaw(slideDiv.value)) {
-    let view = toRaw(slideDiv.value).jsvMaskView;
+    let view = toRaw(slideDiv.value).jsvGetProxyView(true);
     var drag_setting = new Forge.DragSetting(
       dragDirection,
       20,
@@ -1759,7 +1784,7 @@ const _initItemViewTouch = (itemDivRef, index) => {
   if (props.enableTouch) {
     if (itemDivRef) {
       // 为view添加触控处理
-      let view = itemDivRef.jsvMaskView;
+      let view = itemDivRef.jsvGetProxyView(true);
       let dragSetting = new Forge.DragSetting(
         Forge.DragSetting.DIRECTION_DISABLE,
         20,
@@ -1808,6 +1833,7 @@ templateParser = _getTemplateParser(
   props.supportHistoryPath,
   props.layoutType
 );
+
 templateItemAdder = new TemplateItemAdder(
   templateParser,
   dataList,
@@ -1846,7 +1872,7 @@ slidePile = new Forge.RectArea(
 let init_focus_id = 0;
 let cur_visible_start = 0;
 
-if (typeof props.initFocusId == 'number') {
+if (typeof props.initFocusId == "number") {
   templateItemAdder.tryAddItemById(props.initFocusId);
   const item = templateParser.GetItemById(props.initFocusId);
   if (item) {
@@ -1884,7 +1910,7 @@ onMounted(() => {
     _slideTo(visibleInfo.start, null);
   }
 
-  onItemFocus(templateParser.FocusIdToIndex(focusId), preEdgeRect);
+  onItemFocus(templateParser.IdToIndex(focusId), preEdgeRect);
 
   if (props.enableItemRenderBreak) {
     nextTick(() => {
@@ -1918,7 +1944,7 @@ defineExpose(exportObject);
       top: top,
       width: width,
       height: height,
-      overflow: 'hidden',
+      overflow: disableClip ? null : 'hidden',
     }"
   >
     <div :style="{ left: innerPadding.left, top: innerPadding.top }">

package/utils/JsViewEngineWidget/TemplateParser.js

@@ -1,7 +1,7 @@
 /* eslint-disable */
 import { RangesModel, SingleRangeModel } from "./RangeModel";
 import { RectArea } from "./RectUtils";
-import { VERTICAL, HORIZONTAL } from "./WidgetCommon";
+import { VERTICAL, HORIZONTAL, FocusMoveType } from "./WidgetCommon";
 const TAG = "TemplateParser: ";
 
 function integerCheck(value, warn_func) {
@@ -1064,7 +1064,7 @@ class TemplateParser {
     return this._Template.List.length;
   }
 
-  FocusIdToIndex(id) {
+  IdToIndex(id) {
     return this._Template.IdsMap[id];
   }
 
@@ -1200,64 +1200,6 @@ class TemplateParser {
         this._FindFocusableNeighbor("right", item);
       }
     }
-    // if (this._Template.Orient.type !== VERTICAL) {
-    //   // 从后向前找(最后一项不用检查）
-    //   // 如果向下未找到对象，则查找最后一行的最后一项
-    //   let last_down_idx = null;
-    //   let min_distance = -1;
-    //   let distance = 0;
-    //   // 向下操作 只检查最后一项
-    //   for (let k = last_item_index - 1; k >= 0; k--) {
-    //     const pre_col_item = template_list[k];
-    //     if (pre_col_item.focusable) {
-    //       if (pre_col_item.yPos >= last_item.yPos + last_item.height) {
-    //         if (
-    //           pre_col_item.neighborIndexList.right.length === 0 ||
-    //           !this._CheckIdsHasFocusable(
-    //             pre_col_item.neighborIndexList.right
-    //           ) ||
-    //           this._IsInNeighborList(
-    //             pre_col_item.neighborIndexList.right,
-    //             last_item_index
-    //           )
-    //         ) {
-    //           // 有邻居中有last_item_index
-    //           distance =
-    //             (last_item.xPos - pre_col_item.xPos) ** 2 +
-    //             (last_item.yPos - pre_col_item.yPos) ** 2;
-    //           if (min_distance === -1) {
-    //             min_distance = distance;
-    //             last_down_idx = k;
-    //           } else if (min_distance > distance) {
-    //             min_distance = distance;
-    //             last_down_idx = k;
-    //           }
-    //         }
-    //       }
-    //     }
-    //   }
-    //   if (last_down_idx) {
-    //     last_item.neighborIndexList.bottom = []; // 清除无效项
-    //     console.log('cchtest bottom add 2', last_down_idx)
-    //     last_item.neighborIndexList.bottom.push(last_down_idx);
-    //   }
-    // } else {
-    //   // vertical
-    //   for (let k = last_item_index - 1; k >= 0; k--) {
-    //     const pre_row_item = template_list[k];
-    //     if (pre_row_item.focusable) {
-    //       if (
-    //         pre_row_item.yPos + pre_row_item.height <
-    //         last_item.yPos + last_item.height
-    //       ) {
-    //         if (pre_row_item.neighborIndexList.bottom.length === 0) {
-    //           console.log('cchtest bottom add 3', last_item_index)
-    //           pre_row_item.neighborIndexList.bottom.push(last_item_index);
-    //         }
-    //       }
-    //     }
-    //   }
-    // }
   }
 
   /**
@@ -1270,47 +1212,76 @@ class TemplateParser {
    * @param {int} base_item_id         Item的Id
    * @param {int} vertical_offset     纵向偏移(-1为向上，1为向下）
    * @param {int} horizontal_offset   横向偏移(-1为向左，1为向右）
-   * @param {bool} need_loop          循环查找
+   * @param {int} focus_move_type     焦点移动设置
    * @return {int}    下一个Item的Id，-1为该方向未找到Item(到达边缘)
    * */
-  GetNextItem(base_item_id, vertical_offset, horizontal_offset, need_loop) {
+  GetNextItem(
+    base_item_id,
+    vertical_offset,
+    horizontal_offset,
+    focus_move_type
+  ) {
     if (vertical_offset === 0 && horizontal_offset === 0)
       console.log("GetNextItem(): offset is 0");
     // Forge.ThrowError("GetNextItem(): offset is 0");
 
     if (vertical_offset !== 0 && horizontal_offset !== 0) {
       console.log(
-        "GetNextItem(): not support change vertical and horizontal and the same time"
+        "GetNextItem(): not support change vertical and horizontal at the same time"
       );
       // Forge.ThrowError("GetNextItem(): not support change vertical and horizontal and the same time");
     }
 
-    const list_index = this._Template.IdsMap[base_item_id];
+    const item_index = this.IdToIndex(base_item_id);
     const offset = vertical_offset !== 0 ? vertical_offset : horizontal_offset;
     let next_template_item = this._GetNextItem(
-      list_index,
+      item_index,
       offset,
       vertical_offset !== 0
     );
+    const is_vertical = this._Template.Orient.type === VERTICAL;
 
-    if (need_loop && next_template_item === null) {
-      if (vertical_offset !== 0) {
-        next_template_item = this._GetNextLoopItemVertical(
-          list_index,
-          vertical_offset
+    if (next_template_item === null) {
+      // 在次方向的焦点移动才会loop
+      if (
+        is_vertical &&
+        focus_move_type & FocusMoveType.ROW_LOOP &&
+        horizontal_offset != 0
+      ) {
+        next_template_item = this._GetNextLoopItem(
+          item_index,
+          horizontal_offset,
+          is_vertical
         );
-      } else {
-        next_template_item = this._GetNextLoopItemHorizontal(
-          list_index,
-          horizontal_offset
+      } else if (
+        !is_vertical &&
+        focus_move_type & FocusMoveType.COLUMN_LOOP &&
+        vertical_offset != 0
+      ) {
+        next_template_item = this._GetNextLoopItem(
+          item_index,
+          vertical_offset,
+          is_vertical
         );
       }
     }
 
     if (next_template_item === null) {
-      return -1;
+      // 临近行的焦点移动
+      if (
+        vertical_offset != 0 &&
+        focus_move_type & FocusMoveType.ROW_FIND_NEAR
+      ) {
+        next_template_item = this._GetNearLineItem(item_index, vertical_offset, true);
+      } else if (
+        horizontal_offset != 0 &&
+        focus_move_type & FocusMoveType.COLUMN_FIND_NEAR
+      ) {
+        next_template_item = this._GetNearLineItem(item_index, horizontal_offset, false);
+      }
     }
-    return next_template_item.id;
+
+    return next_template_item;
   }
 
   _GetNextItem(index, offset, vertical) {
@@ -1476,94 +1447,115 @@ class TemplateParser {
     return null;
   }
 
-  _GetNextLoopItemVertical(index, offset) {
-    const template_list = this._Template.List;
-    const base_item = template_list[index];
-    const center_x = base_item.centerXPos;
-    let direction = "bottom";
-    // Normalize offset
-    if (offset > 0) {
-      direction = "top";
-    }
-    let found = false;
-    let next_index = -1;
+  _GetItemDistance(item1, item2) {
+    return (
+      Math.pow(item1.centerXPos - item2.centerXPos, 2) +
+      Math.pow(item1.centerYPos - item2.centerYPos, 2)
+    );
+  }
 
-    // 获得邻近点列表
-    let neighbor_list = template_list[index].neighborIndexList[direction];
-    if (template_list[index].tmpNeighborIndexList[direction].length > 0) {
-      neighbor_list = neighbor_list.concat(
-        template_list[index].tmpNeighborIndexList[direction]
-      );
+  _GetTotalNeighbor(index, direction) {
+    const item = this._Template.List[index];
+    return item.neighborIndexList[direction].concat(
+      item.tmpNeighborIndexList[direction]
+    );
+  }
+
+  _GetNearestItem(target_item_index, item_index_list) {
+    let nearest_index = -1,
+      min_distance = Number.POSITIVE_INFINITY;
+    let target_item = this._Template.List[target_item_index];
+    for (let i of item_index_list) {
+      const d = this._GetItemDistance(this._Template.List[i], target_item);
+      if (d < min_distance) {
+        nearest_index = i;
+        min_distance = d;
+      }
     }
+    return nearest_index;
+  }
 
-    while (neighbor_list.length >= 1) {
-      for (let i = 0; i < neighbor_list.length; i++) {
-        next_index = neighbor_list[i];
-        const checking_item = template_list[next_index];
-        if (
-          center_x <= checking_item.xPos + checking_item.width - 1 &&
-          center_x >= checking_item.xPos
-        ) {
-          neighbor_list =
-            template_list[next_index].neighborIndexList[direction];
-          found = true;
+  _GetNextLoopItem(index, offset, is_vertical) {
+    const template_list = this._Template.List;
+    const base_item = template_list[index];
+    let search_direction = is_vertical ? "right" : "bottom";
+    let start_direction = is_vertical ? "top" : "left";
+    if (offset > 0) {
+      search_direction = is_vertical ? "left" : "top";
+      start_direction = is_vertical ? "bottom" : "right";
+    }
+    let target_index = -1;
+    let focusable_target = -1;
+    let start_index = -1;
+    let neighbor_list = [];
+    //寻找下一列的起始item
+    neighbor_list = this._GetTotalNeighbor(index, search_direction);
+    while (start_index < 0 && neighbor_list.length > 0) {
+      for (let i of neighbor_list) {
+        if (this._GetTotalNeighbor(i, start_direction).length > 0) {
+          start_index = i;
           break;
+        } else {
+          //TODO 是否要用递归
+          neighbor_list = this._GetTotalNeighbor(i, search_direction);
         }
       }
     }
+    if (start_index >= 0) {
+      neighbor_list = this._GetTotalNeighbor(start_index, start_direction);
+
+      //寻找最近的neighbor
+      let nearest_index = -1,
+        min_distance = Number.POSITIVE_INFINITY;
+      for (let i of neighbor_list) {
+        const d = this._GetItemDistance(template_list[i], base_item);
+        if (d < min_distance) {
+          nearest_index = i;
+          min_distance = d;
+        }
+      }
 
-    if (found) {
-      if (!template_list[next_index].focusable) {
-        // 如果是占位符，则查找占位符的下一个
-        return this._GetNextLoopItemVertical(next_index, offset);
+      neighbor_list = this._GetTotalNeighbor(nearest_index, search_direction);
+      while (neighbor_list.length > 0) {
+        target_index = this._GetNearestItem(nearest_index, neighbor_list);
+        if (template_list[target_index].focusable) {
+          focusable_target = target_index;
+        }
+        neighbor_list = this._GetTotalNeighbor(target_index, search_direction);
+      }
+      if (focusable_target >= 0) {
+        return template_list[focusable_target];
+      } else if (target_index >= 0) {
+        return this._GetNextLoopItem(target_index, offset, is_vertical);
       }
-      return template_list[next_index];
     }
     return null;
   }
 
-  _GetNextLoopItemHorizontal(index, offset) {
+  //获取临近行的item
+  _GetNearLineItem(index, offset, is_vertical) {
     const template_list = this._Template.List;
-    const base_item = template_list[index];
-    const center_y = base_item.centerYPos;
-    let direction = "right";
+    let search_direction = is_vertical ? "right" : "bottom";
+    let start_direction = is_vertical ? "top" : "left";
     if (offset > 0) {
-      direction = "left";
-    }
-    let found = false;
-    let next_index = -1;
-
-    // 获得邻近点列表
-    let neighbor_list = template_list[index].neighborIndexList[direction];
-    if (template_list[index].tmpNeighborIndexList[direction].length > 0) {
-      neighbor_list = neighbor_list.concat(
-        template_list[index].tmpNeighborIndexList[direction]
-      );
-    }
-
-    while (neighbor_list.length >= 1) {
-      for (let i = 0; i < neighbor_list.length; i++) {
-        next_index = neighbor_list[i];
-        const checking_item = template_list[next_index];
-        if (
-          center_y <= checking_item.yPos + checking_item.height - 1 &&
-          center_y >= checking_item.yPos
-        ) {
-          neighbor_list =
-            template_list[next_index].neighborIndexList[direction];
-          found = true;
-          break;
+      search_direction = is_vertical ? "left" : "top";
+      start_direction = is_vertical ? "bottom" : "right";
+    }
+    let start_index = -1;
+    let neighbor_list = [];
+    //寻找下一列的起始item
+    neighbor_list = this._GetTotalNeighbor(index, search_direction);
+    while (start_index < 0 && neighbor_list.length > 0) {
+      for (let i of neighbor_list) {
+        const n = this._GetTotalNeighbor(i, start_direction);
+        if (n.length > 0) {
+          return template_list[this._GetNearestItem(index, n)];
+        } else {
+          //TODO 是否要用递归
+          neighbor_list = this._GetTotalNeighbor(i, search_direction);
         }
       }
     }
-
-    if (found) {
-      if (!template_list[next_index].focusable) {
-        // 如果是占位符，则查找占位符的下一个
-        return this._GetNextLoopItemHorizontal(next_index, offset);
-      }
-      return template_list[next_index];
-    }
     return null;
   }