鸿蒙开发者学堂【构建更加丰富的页面】习题与答案

【习题】构建更加丰富的页面

判断题

  1. Tabs组件可以通过接口传入一个TabsController，该TabsController可以控制Tabs组件进行页签切换。\color{red}{正确}
    正确(True)
    错误(False)

知识点
TabsController的作用。解析：TabsController作为Tabs组件的控制器，用于控制Tabs组件进行页签切换。不支持一个TabsController控制多个Tabs组件。

  1. 通过listDirection属性，可以设置List组件的排列方向，设置为Axis.Horizontal时，方向为纵向，为Axis.Vertical时，方向为横向。\color{red}{错误}
    正确(True)
    错误(False)

知识点
List组件排列方向的设置。解析：Axis.Vertical方向为纵向，Axis.Horizontal方向为横向。

  1. Navigation组件是路由导航的根视图容器，一般作为Page页面的根容器使用，可以通过该组件提供的路由能力实现首页与非首页的切换。\color{red}{正确}
    正确(True)
    错误(False)

知识点
Navigation的基本概念。解析：Navigation组件是路由导航的根视图容器，一般作为Page页面的根容器使用，其内部默认包含了标题栏、内容区和工具栏，其中内容区默认首页显示导航内容（Navigation的子组件）或非首页显示（NavDestination的子组件），首页和非首页通过路由进行切换。

单选题

  1. Grid组件内，如何设置GridItem在水平方向上，后一列是前一列宽度的2倍？\color{red}{C}
    A. rowsTemplate('1fr 2fr 4fr 8fr')
    B. rowsTemplate('8fr 4fr 2fr 1fr')
    C. columnsTemplate ('1fr 2fr 4fr 8fr')
    D. columnsTemplate ('8fr 4fr 2fr 1fr')

知识点
Grid子组件行列数量占比的设置。解析：columnsTemplate的值为'1fr 1fr 1fr 1fr'时，表示这个网格为4列，将Grid允许的宽分为4等分，每列占1份。 当值为'1fr 2fr 4fr 8fr'，表示这个网格为4列，第一列占1份，第二列占2份，第三列占4份，第四列占8份。

  1. Tabs组件如何设置导航栏为左侧边导航：\color{red}{D}
    A. 设置BarPosition参数为BarPosition.End，vertical属性保持默认设置或设置为false。
    B. 设置BarPosition参数为BarPosition.Start，vertical属性保持默认设置或设置为false。
    C. 设置BarPosition参数为BarPosition.End，同时设置vertical属性为true。
    D. 设置BarPosition参数为BarPosition.Start，同时设置vertical属性为true。

知识点
TabBar位置和排列方向的设置。解析：Tabs组件的导航栏位置可以进行设置，具体对应关系如下：底部导航：barPosition参数设置为BarPosition.End，vertical属性不设置或设置为false。顶部导航：barPosition参数设置为BarPosition.Start，vertical属性不设置或设置为false。左侧边导航： barPosition参数设置为BarPosition.Start，vertical属性设置为true。右侧边导航：barPosition参数设置为BarPosition.End，vertical属性设置为true。

  1. 以下关于页面跳转相关方法说法不正确的是：\color{red}{D}
    A. pushPathByName方法可以将参数对应的页面栈信息进行入栈，从而完成对应页面的跳转。
    B. pushPathByName方法需要依次传入页面名称，路由参数以及是否开启转场动画，其中转场动画默认开启。
    C. replacePathByName方法会将页面栈栈顶元素退出，再将传入参数对应的页面栈信息进行入栈。
    D. replacePathByName方法需要传入一个NavPathInfo类型的对象，该对象包含了NavDestination页面的信息。

知识点
Navigation页面跳转方法。解析：pushPathByName方法能将该方法所传递的参数对应的页面栈信息进行入栈，然后显示入栈后的页面，从而完成对应的页面跳转，该方法需要依次传递页面名称、页面跳转参数以及是否开启转场动画等数据，其中转场动画默认开启。replacePathByName方法会将当前页面栈栈顶元素退出，再将传入参数对应的页面栈信息进行入栈，传入参数与pushPathByName类似，需要依次传递页面名称、页面跳转参数等数据，而并不需要传递一个NavPathInfo类型的对象。

  1. 下面哪个组件层次结构是错误的？\color{red}{C}
    A. List>ListItem>Column
    B. Column>List>ListItem
    C. Grid>Row>GridItem
    D. Grid>GridItem

知识点
组件层次结构。解析：正确的层次结构应为Row>Grid>GridItem。

多选题

  1. 以下属于Navigation布局模式的有：\color{red}{ABD}
    A. 自适应模式
    B. 单页面模式
    C. 层叠模式
    D. 分栏模式

知识点
Navigation布局模式。解析：通过调整Navigation组件的mode属性能够设置页面的显示模式，该属性有三个取值：1.NavigationMode.Stack。单页面模式，在该模式下，首页与非首页均以单个页面的形式进行展示，效果上类似于页面跳转。2.NavigationMode.Split。分栏模式，在该模式下，首页与非首页呈左右分栏布局。3.NavigationMode.Auto。自适应模式，在该模式下当设备宽度大于520vp时，Navigation组件采用分栏模式，反之采用单页面模式。这也是Navigation组件天然支持一多的原因。

  1. 关于Swiper组件的相关描述正确的是：\color{red}{ABCD}
    A. 当loop为true时，在显示第一页或最后一页时，可以继续往前切换到前一页或者往后切换到后一页。如果loop为false，则在第一页或最后一页时，无法继续向前或者向后切换页面。当loop为true时，在显示第一页或最后一页时，可以继续往前切换到前一页或者往后切换到后一页。如果loop为false，则在第一页或最后一页时，无法继续向前或者向后切换页面。
    B. Swiper通过设置autoPlay属性，控制是否自动轮播子组件。
    C. Swiper支持水平和垂直方向上进行轮播，主要通过vertical属性控制。
    D. Swiper支持手指滑动、点击导航点和通过控制器三种方式切换页面。

知识点
Swiper组件的概念和使用。解析：循环播放： 通过loop属性控制是否循环播放，该属性默认值为true。 当loop为true时，在显示第一页或最后一页时，可以继续往前切换到前一页或者往后切换到后一页。如果loop为false，则在第一页或最后一页时，无法继续向前或者向后切换页面。自动轮播：Swiper通过设置autoPlay属性，控制是否自动轮播子组件。该属性默认值为false。轮播方向：Swiper支持水平和垂直方向上进行轮播，主要通过vertical属性控制。页面切换方式：Swiper支持手指滑动、点击导航点和通过控制器三种方式切换页面。

  1. 关于Grid组件的相关描述正确的是：\color{red}{ABCE}
    A. 网格布局是由“行”和“列”分割的单元格所组成，具有较强的页面均分能力，子组件占比控制能力。
    B. Grid组件提供了rowsTemplate和columnsTemplate属性用于设置网格布局行列数量与尺寸占比。
    C. 设置网格容器的步骤：准备待循环的数据源、设置网格容器Grid、利用ForEach对数据进行渲染。
    D. 如果设置的是columnsTemplate，Grid的滚动方向为水平方向；如果设置的是rowsTemplate，Grid的滚动方向为垂直方向。
    E. Grid用于设置网格布局相关参数，GridItem定义子组件相关特征。Grid组件支持使用条件渲染、循环渲染、懒加载等方式生成子组件。

知识点
Grid组件的概念和使用。解析：如果设置的是columnsTemplate，Grid的滚动方向为垂直方向；如果设置的是rowsTemplate，Grid的滚动方向为水平方向。

©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容