Harmony OS — ScrollView滑动视图
2023-09-14 09:13:54 时间
1、ScrollView 是什么?
简单:滑动视图
官方:ScrollView是一种带滚动功能的组件,它采用滑动的方式在有限的区域内显示更多的内容。
2、简单实用
<ScrollView
ohos:id="$+id:scrollview"
ohos:height="300vp"
ohos:width="300vp"
ohos:background_element="#FFDEAD"
ohos:top_margin="32vp"
ohos:bottom_padding="16vp"
ohos:layout_alignment="horizontal_center">
<DirectionalLayout
ohos:height="match_content"
ohos:width="match_content">
<Image
ohos:width="300vp"
ohos:height="match_content"
ohos:top_margin="16vp"
ohos:image_src="$media:Android"/>
<Image
ohos:width="300vp"
ohos:height="match_content"
ohos:top_margin="16vp"
ohos:image_src="$media:AI"/>
<Image
ohos:width="300vp"
ohos:height="match_content"
ohos:top_margin="16vp"
ohos:image_src="$media:AIOT"/>
<Image
ohos:width="300vp"
ohos:height="match_content"
ohos:top_margin="16vp"
ohos:image_src="$media:HarmonyOS"/>
</DirectionalLayout>
</ScrollView>
3、设置 ScrollView
(1)点击按钮,根据像素数平滑滚动。
ScrollView scrollView = (ScrollView) findComponentById(ResourceTable.Id_scrollview);
Button btnScroll= (Button) findComponentById(ResourceTable.Id_btnScroll);
//根据像素数平滑滚动
btnScroll.setClickedListener(component -> {
scrollView.fluentScrollByY(300);
});
<?xml version="1.0" encoding="utf-8"?>
<DirectionalLayout
xmlns:ohos="http://schemas.huawei.com/res/ohos"
ohos:height="match_parent"
ohos:width="match_parent"
ohos:orientation="vertical"
ohos:left_padding="40vp"
ohos:top_padding="40vp">
<ScrollView
ohos:id="$+id:scrollview"
ohos:height="300vp"
ohos:width="300vp"
ohos:background_element="#FFDEAD"
ohos:top_margin="32vp"
ohos:bottom_padding="16vp"
ohos:layout_alignment="horizontal_center">
<DirectionalLayout
ohos:height="match_content"
ohos:width="match_content">
<Image
ohos:width="300vp"
ohos:height="match_content"
ohos:top_margin="16vp"
ohos:image_src="$media:Android"/>
<Image
ohos:width="300vp"
ohos:height="match_content"
ohos:top_margin="16vp"
ohos:image_src="$media:AI"/>
<Image
ohos:width="300vp"
ohos:height="match_content"
ohos:top_margin="16vp"
ohos:image_src="$media:AIOT"/>
<Image
ohos:width="300vp"
ohos:height="match_content"
ohos:top_margin="16vp"
ohos:image_src="$media:HarmonyOS"/>
</DirectionalLayout>
</ScrollView>
<Button
ohos:id="$+id:btnScroll"
ohos:height="match_content"
ohos:width="match_parent"
ohos:background_element="#FFF10B0B"
ohos:text_size="20vp"
ohos:text_color="#FFFAF6F6"
ohos:top_margin="15fp"
ohos:text="Scroll By Y:300"/>
</DirectionalLayout>
(2)点击按钮,平滑滚动到指定位置
scrollView.fluentScrollYTo(500);
(3)设置水平方向
<ScrollView
...
ohos:rebound_effect="true">
...
</ScrollView>
(4)设置回弹效果
<ScrollView
...
ohos:rebound_effect="true">
...
</ScrollView>
scrollView.setReboundEffect(true);
(5)设置缩放匹配效果
<ScrollView
...
ohos:match_viewport="true">
...
</ScrollView>
scrollView.setMatchViewportEnabled(true);
4、了解更多
相关文章
- mac os x安装教程_OS X EI Capitan
- scRNA分析|多样本merge 和 harmony去批次
- 单细胞转录组 | 多样本处理与Harmony整合
- 【解读合约审计】Harmony的跨链桥是如何被盗一亿美金的?
- 【愚公系列】2023年02月 .NET CORE工具案例-Lib.Harmony之AOP拦截
- 之间的差异比较OS和Linux的区别(os和linux)
- os在Linux中安装Mac OS系统(linux下安装mac)
- Ubuntu 系统中通过火狐os模拟器轻松体验 Firefox OS
- Harmony 音乐播放器主题 Arc
- Harmony OS 家族新成员!这些能力让人期待
- 『Linux查看OS版本:解答一步到位』(linux查看os版本)
- os中南大学:Linux OS的不断发展(中南大学linux)
- Oracle OS:探索最先进的数据库系统(oracle的os)
- Exploring the Advantages of Linux OS for Your Computing Needs!(linux.os)
- 统信OS可安装Redis吗(统信os能装redis么)
- Oracle OS上保持良好的时间同步(oracle os时间)
- 以oracle OS命令控制你的系统(oracle os命令)