1

用户说：“给我看中文菜单”

我使用单元格区域来显示食物，因为这是我想要的卡片布局（垂直和小图像）。

但是，因为我要列出 80 多个项目，是否可以先向用户显示 10 个项目，然后再显示“显示更多...”按钮？

如果用户单击“显示更多按钮”，我应该以不同的方式打开菜单，result-view或者在同一页面中列出隐藏“显示更多...”按钮的其余菜单。

我知道image-list有这个选项，但图像与图像相比有点大cell-area，水平显示它，我想要它垂直显示。

场景 2：
用户：
我的详情页面中我所在地区的 Pizzahut 在哪里，bixby 将显示一个带有图像的商店，下图是带有地图的位置，下面是菜单列表。所以三个块进入结果。第一块是compound-card，第二块是map-card，第三块是cell-area。现在第三个菜单块有 20 多个项目，我将其列出。我希望它显示 5 个项目和一个显示更多链接，一旦用户单击一个显示更多链接，菜单的其余部分就会放在那里，或者我可以将它重定向到一个包含所有菜单列表的新页面...一切皆有可能。

4

1 回答 1

0

对于大量结果，最好的方法是您使用navigation-mode.

navigation-mode {
  read-many-and-next {
    underflow-statement (This is the first page of results)
    list-summary ("I have #{size(this)} results")
    overflow-statement (That's all I have)
    overflow-question (What would you like to do?)
    next-page-question (Do you want the next page?)
    page-size (10)
  }
}

这可确保您为用户提供结果的分页视图，以便用户可以零碎地使用它们，而不是被 2 组结果（前 10 个，然后是接下来的 70 个）淹没。

添加信息以说明修改后的问题

该highlights功能可以在更简单的视图中使用，但对于更复杂的视图，我建议手动添加 5 次菜单项迭代以显示前 5 个项目，然后使用带有 的卡片on-click拉出整个菜单并将其显示在单独的result-view. 我在下面添加了一个代码示例，其中包含一些占位符概念和操作。

代码示例：

single-line {
  text {
    style (Title_S)
    value ("#{value(menu[0])}")
  }
}
divider
single-line {
  text {
    style (Title_S)
    value ("#{value(restaurant.menu[1])}")
  }
}
divider
single-line {
  text {
    style (Title_S)
    value ("#{value(restaurant.menu[2])}")
  }
}
divider
single-line {
  text {
    style (Title_S)
    value ("#{value(restaurant.menu[3])}")
  }
}
divider
single-line {
  text {
    style (Title_S)
    value ("#{value(restaurant.menu[4])}")
  }
}
divider
cell-card {
  slot2 { 
    content {
      order (PrimarySecondary)
      primary {
        template ("See Full Menu")
      }
    }
  }
  on-click {
    intent {
      goal:GetFullMenu
      value-set: RestaurantName ("#{value(restaurant.name)}")
    }
  }
}
于 2019-03-27T23:39:03.190 回答