@shijiu/jsview-vue 1.9.888 → 1.9.915

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@shijiu/jsview-vue",
-  "version": "1.9.888",
+  "version": "1.9.915",
   "license": "MIT",
   "repository": "system/jsview-framework",
   "author": "mengxk",

package/utils/JsViewEngineWidget/MetroWidget/MetroWidget.vue

@@ -1,8 +1,6 @@
 <!--
  * @Author: ChenChanghua
  * @Date: 2021-09-22 16:08:58
- * @LastEditors: ChenChanghua
- * @LastEditTime: 2022-12-19 11:17:10
  * @Description: file content
 -->
 
@@ -23,13 +21,7 @@
  *      name {string} 用于设置焦点的名称
  *      padding {object} 控件内边距， 默认为{left: 0, right: 0, top: 0, bottom: 0}
  *      direction {enum} (必选)控件方向 HORIZONTAL/VERTICAL
- *      focusMoveType {int} 焦点移动的模式, 可通过 | 运算进行组合
-                          NO_ADJUST: 无特殊处理
-                          COLUMN_LOOP: 到达列首/尾后跳转到上/下一列, 只在水平滚动时生效
-                          ROW_LOOP: 到达行首/尾后跳转到上/下一行, 只在竖直滚动时生效
-                          COLUMN_FIND_NEAR: 一列中没有下一个元素时是否跳转到相邻列
-                          ROW_FIND_NEAR: 一行中没有下一个元素时是否跳转到相邻行
-
+ *      loopFocus {boolean} 焦点到边界后自动转到下一行，默认false
  *      initFocusId {int} 初始焦点，默认为0
  *      slideSetting {SlideSetting} 页面滑动的设置, 目前SlideSetting有三个子类, 具体见 WidgetCommon 中的说明
                                     WholePageSlide
@@ -86,7 +78,6 @@
  *      loadAll {boolean} 加载不显示的view，触控场景使用
  *      flingPageWidth {}
  *      flingPageEdge {}
- *      disableClip {boolean} 取消显示范围的clipView
  *    methods:
         getFocusBlockRef 获取此MetroWidget的 jsv-focus-block句柄，可以使用requestFocus完成获焦
 
@@ -182,7 +173,6 @@
 
 <script setup>
 /* eslint-disable */
-import { Forge } from "@shijiu/jsview/dom/jsv-forge-define"
 import {
   ref,
   reactive,
@@ -193,6 +183,7 @@ import {
   toRaw,
   nextTick,
 } from "vue";
+import { Forge } from "@shijiu/jsview/dom/jsv-forge-define";
 import { TemplateParser, TemplateItemAdder } from "../TemplateParser";
 import { PageUpdater } from "./PageUpdater";
 import { SingleRangeModel } from "../RangeModel";
@@ -404,14 +395,6 @@ const props = defineProps({
   onScroll: {
     type: Function,
   },
-  focusMoveType: {
-    type: Number,
-    default: 0,
-  },
-  disableClip: {
-    type: Boolean,
-    default: false,
-  },
 });
 
 let dataUpdateToken = ref(0);
@@ -438,7 +421,7 @@ let itemRender = ref(!props.enableItemRenderBreak);
 let permanentItemList = [];
 let preUpdateVisibleStart = 0;
 let mounted = false;
-let focusNode = shallowRef(null);
+let focusNode = ref(null);
 let pageRange = vertical ? props.height : props.width;
 
 let slideLock = false;
@@ -479,8 +462,8 @@ let visibleInfo = {
   },
 };
 
-let locateDiv = shallowRef(null);
-let slideDiv = shallowRef(null);
+let locateDiv = ref(null);
+let slideDiv = ref(null);
 let renderData = shallowRef([]);
 let slideDivLeft = ref(0);
 let slideDivTop = ref(0);
@@ -498,7 +481,7 @@ const _onFocusChange = (id) => {
 const _getCurrentId = () => {
   return {
     id: focusId,
-    index: templateParser.IdToIndex(focusId),
+    index: templateParser.FocusIdToIndex(focusId),
   };
 };
 
@@ -578,7 +561,7 @@ const setFocusId = (id, needSlide = true, doAnim = false, extraSetting) => {
   let next_focus_item = templateParser.GetItemById(id);
   if (next_focus_item) {
     if (needSlide) {
-      slideToItem(templateParser.IdToIndex(id), doAnim);
+      slideToItem(templateParser.FocusIdToIndex(id), doAnim);
     }
     let unlock = null;
     if (extraSetting) {
@@ -604,8 +587,8 @@ const setFocusId = (id, needSlide = true, doAnim = false, extraSetting) => {
     };
     _updateBlurItem();
     _updateFocusItem();
-    onItemBlur(templateParser.IdToIndex(preFocusId));
-    onItemFocus(templateParser.IdToIndex(focusId), preEdgeRect);
+    onItemBlur(templateParser.FocusIdToIndex(preFocusId));
+    onItemFocus(templateParser.FocusIdToIndex(focusId), preEdgeRect);
     unlock?.();
   }
 };
@@ -812,7 +795,7 @@ const refreshData = (force_update) => {
   dataUpdateToken.value++;
   pageUpdater.apply();
   _updateFocusItem();
-  onItemFocus(templateParser.IdToIndex(focusId), null);
+  onItemFocus(templateParser.FocusIdToIndex(focusId), null);
   if (needSlide) {
     _slideTo(visibleInfo.start, null);
   } else if (need_update_content) {
@@ -1068,7 +1051,7 @@ const onKeyDown = (ev) => {
       _moveToNext(horizontal_direction, vertical_direction);
       break;
     case 13:
-      onItemClick(templateParser.IdToIndex(focusId));
+      onItemClick(templateParser.FocusIdToIndex(focusId));
       break;
     default:
       //只接受上下左右确定键
@@ -1108,7 +1091,7 @@ const _onTemplateAdd = (item) => {
         this.slotMounted.value = true;
         if (callFocusAfterUpdate && this.data.id === focusId) {
           nextTick(() => {
-            onItemFocus(templateParser.IdToIndex(focusId), preEdgeRect);
+            onItemFocus(templateParser.FocusIdToIndex(focusId), preEdgeRect);
           });
           callFocusAfterUpdate = false;
         }
@@ -1203,19 +1186,14 @@ const _onCustomerEvent = (ev) => {
         direction = 1;
       }
     }
-    let item_layout = getPositionRelativeToView(
-      item_div,
-      toRaw(locateDiv.value)
-    );
+    const item_layout = item_div.jsvGetRelativePosition(toRaw(locateDiv.value));
 
     let obj = {
       xPos: item_layout.left,
       yPos: item_layout.top,
       width: item_layout.width,
       height: item_layout.height,
-      centerYPos: Math.floor(item_layout.top + item_layout.height / 2),
-      centerXPos: Math.floor(item_layout.left + item_layout.width / 2),
-      index: templateParser.IdToIndex(focusId),
+      index: templateParser.FocusIdToIndex(focusId),
     };
 
     let cur_slide = _calculateVisibleStart(obj, direction);
@@ -1261,14 +1239,15 @@ const _moveToNext = (
   item_edge_rect
 ) => {
   let cur_focus_item = templateParser.GetItemById(focusId);
-  let next_focus_item = templateParser.GetNextItem(
+  let next_item_id = templateParser.GetNextItem(
     focusId,
     vertical_direction,
     horizontal_direction,
-    props.focusMoveType
+    props.loopFocus
   );
-  if (next_focus_item !== null) {
+  if (next_item_id >= 0) {
     preFocusId = focusId;
+    let next_focus_item = templateParser.GetItemById(next_item_id);
     templateItemAdder.tryAddItem(next_focus_item, 1);
     focusId = next_focus_item.id;
 
@@ -1277,7 +1256,8 @@ const _moveToNext = (
 
     let cur_visible_start = _calculateVisibleStart(next_focus_item, direction);
     if (
-      !innerData[templateParser.IdToIndex(focusId)].itemConfig?.takeOverSlide &&
+      !innerData[templateParser.FocusIdToIndex(next_item_id)].itemConfig
+        ?.takeOverSlide &&
       visibleInfo.start !== cur_visible_start
     ) {
       if (next_focus_item.doSlide) {
@@ -1299,7 +1279,7 @@ const _moveToNext = (
               1,
             visibleInfo.endWithPadding + props.keepTraceRange * pageRange
           ),
-          next_focus_item.id,
+          next_item_id,
           false,
           permanentItemList
         );
@@ -1309,7 +1289,7 @@ const _moveToNext = (
           templateParser,
           cur_visible_start,
           cur_visible_start + visibleInfo.range + visibleInfo.padding.end - 1,
-          next_focus_item.id,
+          next_item_id,
           false,
           permanentItemList
         );
@@ -1348,8 +1328,8 @@ const _moveToNext = (
     preEdgeRect = rect;
     _updateBlurItem();
     _updateFocusItem();
-    onItemBlur(templateParser.IdToIndex(preFocusId));
-    onItemFocus(templateParser.IdToIndex(focusId), preEdgeRect);
+    onItemBlur(templateParser.FocusIdToIndex(preFocusId));
+    onItemFocus(templateParser.FocusIdToIndex(focusId), preEdgeRect);
   } else {
     let x_off_set = props.direction === VERTICAL ? 0 : visibleInfo.start;
     let y_off_set = props.direction === VERTICAL ? visibleInfo.start : 0;
@@ -1373,7 +1353,7 @@ const _moveToNext = (
       height: cur_focus_item.height,
     };
     props.onEdge?.({ direction: edge, rect: rect });
-    innerData[templateParser.IdToIndex(focusId)].callbacks.onWidgetEdge?.({
+    innerData[templateParser.FocusIdToIndex(focusId)].callbacks.onWidgetEdge?.({
       direction: edge,
     });
   }
@@ -1399,17 +1379,9 @@ const _calculateVisibleStart = (target_item, direction) => {
       );
       break;
     case SlideSetting.Type.WHOLE_PAGE:
-      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
-        ];
-      }
-
+      new_visible_start = templateParser.GetItem(target_item.pageHeadIndex)[
+        pos_key
+      ];
       break;
     case SlideSetting.Type.SEAMLESS:
       if (
@@ -1556,7 +1528,7 @@ const _onFocus = (params) => {
   enterFocusId = -1;
   enterFocusRect = null;
   _updateFocusItem();
-  onItemFocus(templateParser.IdToIndex(focusId), preEdgeRect);
+  onItemFocus(templateParser.FocusIdToIndex(focusId), preEdgeRect);
   props.onFocus?.();
 };
 
@@ -1570,7 +1542,7 @@ const _onBlur = () => {
   }
   preFocusId = focusId;
   _updateBlurItem();
-  innerData[templateParser.IdToIndex(preFocusId)].callbacks.onBlur();
+  innerData[templateParser.FocusIdToIndex(preFocusId)].callbacks.onBlur();
 
   props.onBlur?.();
 };
@@ -1583,11 +1555,11 @@ const _onSlideEnd = (event) => {
 };
 
 const _updateFocusItem = () => {
-  _setZIndex(templateParser.IdToIndex(focusId), innerData.length, true);
+  _setZIndex(templateParser.FocusIdToIndex(focusId), innerData.length, true);
 };
 
 const _updateBlurItem = () => {
-  _setZIndex(templateParser.IdToIndex(preFocusId), 0, false);
+  _setZIndex(templateParser.FocusIdToIndex(preFocusId), 0, false);
 };
 
 const _updateFocusByDragInfo = (viewX, viewY) => {
@@ -1757,9 +1729,7 @@ const _updatePosition = (x, y, anim_info) => {
       slide_animation.SetAnimationListener(
         new Forge.AnimationListener(anim_info.onstart, anim_info.onend, null)
       );
-      toRaw(slideDiv.value)
-        .jsvGetProxyView(true)
-        .StartAnimation(slide_animation);
+      toRaw(slideDiv.value).jsvGetProxyView(true).StartAnimation(slide_animation);
     }
     _onScroll();
   }
@@ -1833,7 +1803,6 @@ templateParser = _getTemplateParser(
   props.supportHistoryPath,
   props.layoutType
 );
-
 templateItemAdder = new TemplateItemAdder(
   templateParser,
   dataList,
@@ -1872,7 +1841,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) {
@@ -1910,7 +1879,7 @@ onMounted(() => {
     _slideTo(visibleInfo.start, null);
   }
 
-  onItemFocus(templateParser.IdToIndex(focusId), preEdgeRect);
+  onItemFocus(templateParser.FocusIdToIndex(focusId), preEdgeRect);
 
   if (props.enableItemRenderBreak) {
     nextTick(() => {
@@ -1944,7 +1913,7 @@ defineExpose(exportObject);
       top: top,
       width: width,
       height: height,
-      overflow: disableClip ? null : 'hidden',
+      overflow: '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, FocusMoveType } from "./WidgetCommon";
+import { VERTICAL, HORIZONTAL } from "./WidgetCommon";
 const TAG = "TemplateParser: ";
 
 function integerCheck(value, warn_func) {
@@ -1064,7 +1064,7 @@ class TemplateParser {
     return this._Template.List.length;
   }
 
-  IdToIndex(id) {
+  FocusIdToIndex(id) {
     return this._Template.IdsMap[id];
   }
 
@@ -1200,6 +1200,64 @@ 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);
+    //         }
+    //       }
+    //     }
+    //   }
+    // }
   }
 
   /**
@@ -1212,76 +1270,47 @@ class TemplateParser {
    * @param {int} base_item_id         Item的Id
    * @param {int} vertical_offset     纵向偏移(-1为向上，1为向下）
    * @param {int} horizontal_offset   横向偏移(-1为向左，1为向右）
-   * @param {int} focus_move_type     焦点移动设置
+   * @param {bool} need_loop          循环查找
    * @return {int}    下一个Item的Id，-1为该方向未找到Item(到达边缘)
    * */
-  GetNextItem(
-    base_item_id,
-    vertical_offset,
-    horizontal_offset,
-    focus_move_type
-  ) {
+  GetNextItem(base_item_id, vertical_offset, horizontal_offset, need_loop) {
     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 at the same time"
+        "GetNextItem(): not support change vertical and horizontal and the same time"
       );
       // Forge.ThrowError("GetNextItem(): not support change vertical and horizontal and the same time");
     }
 
-    const item_index = this.IdToIndex(base_item_id);
+    const list_index = this._Template.IdsMap[base_item_id];
     const offset = vertical_offset !== 0 ? vertical_offset : horizontal_offset;
     let next_template_item = this._GetNextItem(
-      item_index,
+      list_index,
       offset,
       vertical_offset !== 0
     );
-    const is_vertical = this._Template.Orient.type === VERTICAL;
 
-    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
+    if (need_loop && next_template_item === null) {
+      if (vertical_offset !== 0) {
+        next_template_item = this._GetNextLoopItemVertical(
+          list_index,
+          vertical_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
+      } else {
+        next_template_item = this._GetNextLoopItemHorizontal(
+          list_index,
+          horizontal_offset
         );
       }
     }
 
     if (next_template_item === null) {
-      // 临近行的焦点移动
-      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 -1;
     }
-
-    return next_template_item;
+    return next_template_item.id;
   }
 
   _GetNextItem(index, offset, vertical) {
@@ -1447,115 +1476,94 @@ class TemplateParser {
     return null;
   }
 
-  _GetItemDistance(item1, item2) {
-    return (
-      Math.pow(item1.centerXPos - item2.centerXPos, 2) +
-      Math.pow(item1.centerYPos - item2.centerYPos, 2)
-    );
-  }
-
-  _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;
-  }
-
-  _GetNextLoopItem(index, offset, is_vertical) {
+  _GetNextLoopItemVertical(index, offset) {
     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";
+    const center_x = base_item.centerXPos;
+    let direction = "bottom";
+    // Normalize offset
     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;
+      direction = "top";
+    }
+    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_x <= checking_item.xPos + checking_item.width - 1 &&
+          center_x >= checking_item.xPos
+        ) {
+          neighbor_list =
+            template_list[next_index].neighborIndexList[direction];
+          found = true;
           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;
-        }
-      }
 
-      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);
+    if (found) {
+      if (!template_list[next_index].focusable) {
+        // 如果是占位符，则查找占位符的下一个
+        return this._GetNextLoopItemVertical(next_index, offset);
       }
+      return template_list[next_index];
     }
     return null;
   }
 
-  //获取临近行的item
-  _GetNearLineItem(index, offset, is_vertical) {
+  _GetNextLoopItemHorizontal(index, offset) {
     const template_list = this._Template.List;
-    let search_direction = is_vertical ? "right" : "bottom";
-    let start_direction = is_vertical ? "top" : "left";
+    const base_item = template_list[index];
+    const center_y = base_item.centerYPos;
+    let direction = "right";
     if (offset > 0) {
-      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);
+      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;
         }
       }
     }
+
+    if (found) {
+      if (!template_list[next_index].focusable) {
+        // 如果是占位符，则查找占位符的下一个
+        return this._GetNextLoopItemHorizontal(next_index, offset);
+      }
+      return template_list[next_index];
+    }
     return null;
   }