[发明专利]基于react native的瀑布流楼层式展示交互方法、介质及设备

说明书

本发明涉及一种基于react native的瀑布流楼层式展示交互方法、介质及设备，包括以下步骤：基于react native框架显示交互菜单内容，该交互菜单内容采用瀑布流楼层式布局，每个楼层内包含多个单元格，所述楼层或单元格基于配置参数显示，所述交互菜单上显示有一可控焦点；响应对所述交互菜单内容的操作指令，控制所述可控焦点的移动或选择。与现有技术相比，本发明具有提高用户体验、性能高等优点。

技术领域

本发明涉及高清电视和多媒体领域，尤其是涉及一种基于react native的瀑布流楼层式展示交互方法、介质及设备。

背景技术

随着现代社会智能电视的普及，电视或机顶盒所播放的视频内容越来越丰富，涉及的内容范围越来越广，同时也使得电视的操作方式越来越复杂，因此，电视屏幕上视频内容呈现方式和交互操作方法就显得愈发重要。

当前电视屏幕中呈现给用户的页面内容往往比较生硬，一般只有一屏，或者通过上下左右按键操作切换为几屏不同的内容，显得非常单调。或者设置了各类逐层递进地菜单层级，需要用户层层递进地进行选择，进行复杂的逐层操作会带来诸多的不变，操作方法会也显得非常不连贯。同时，现有智能电视或机顶盒开机的界面充斥各类推荐资讯和内容占用了大量本来用于播放视频的屏幕区域，使得对用户的体验也不够友好。

发明内容

本发明的目的就是为了克服上述现有技术存在的缺陷而提供一种提高用户体验、性能高的基于react native的瀑布流楼层式展示交互方法、介质及设备。

本发明的目的可以通过以下技术方案来实现：

一种基于react native的瀑布流楼层式展示交互方法，包括以下步骤：

基于react native框架显示交互菜单内容，该交互菜单内容采用瀑布流楼层式布局，每个楼层内包含多个单元格，所述楼层或单元格基于配置参数显示，所述交互菜单上显示有一可控焦点；

响应对所述交互菜单内容的操作指令，控制所述可控焦点的移动或选择。

进一步地，通过所述配置参数改变交互菜单内容的界面状态，具体通过前端数据流管理框架redux根据所述配置参数改变管理界面样式的数据状态，进而驱使界面发生改变。

进一步地，基于所述配置参数，各所述楼层的排列方式包括从上至下顺序排列、从左至右顺序排列或从里到外层叠排列。

进一步地，基于所述配置参数，楼层内的所述多个单元格的排列方式包括横向排列、纵向排列和二维矩阵排列。

进一步地，所述交互菜单内容包括根视图，通过调整所述根视图的位置调整所述瀑布流楼层式布局中楼层的可见范围，具体地：

需要发生楼层间焦点切换时，判断需切换至的下一楼层是否全部可见，若否，则调节根视图的位置，将不可见区域调整至可见状态。

进一步地，所述将不可见区域调整至可见状态时，对所述根视图的位置添加偏移量。

进一步地，所述操作指令为触屏控制指令或遥控器指令；

对所述触屏控制指令的响应，通过react native封装的PanResponder控制；

对所述遥控器指令的响应，焦点变化的逻辑，在楼层内按照“米”字焦点游走规则，在楼层间按照“十”字游走的规则。

本发明还提供一种计算机可读存储介质，包括供电子设备的一个或多个处理器执行的一个或多个程序，所述一个或多个程序包括用于执行如上所述基于react native的瀑布流楼层式展示交互方法的指令。

本发明还提供一种电子设备，包括：

一个或多个处理器；

存储器；和