Khi ta làm ứng
dụng dài quá thì ta cần dùng ScrollView để cuộn xuống được.
Tại baidau,
ta cho thêm một ảnh nữa giống cái đang có và set khoảng cách với dòng chữ trên
cùng rộng ra, bây giờ ta sẽ không đủ chiều dài để hiển thị.
Để có thể cuộn
xuống ta dùng Scrollview cho riêng hai cái ảnh thôi, tức là dòng chữ ở trên vẫn
cố định không cuộn.
<ScrollView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:fillViewport="true"
>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
>
<ImageView
android:id="@+id/img"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:contentDescription="@null"
android:src="@drawable/abc" />
<ImageView
android:layout_width="500dp"
android:layout_height="230dp"
android:layout_gravity="center_horizontal"
android:contentDescription="@null"
android:src="@drawable/abc"
/>
</LinearLayout>
</ScrollView>
Mục đích để
dòng chữ cố định là sau này ta cho quảng cáo vào chỗ đó, khi người dùng cuộn xuống
thì quảng cáo không bị cuộn theo.
Chú ý là ta
buộc phải cho tất cả những cái cần cuộn vào trong một LinearLayout có hướng
orientation là dọc, nếu không sẽ bị lỗi.
Để cuộn toàn
bộ tất cả xuống, ta dùng Scroll trùm ra ngoài cùng, khi đó các dòng bên trên và
dưới cùng của nó trông như sau:
<?xml version="1.0"
encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:ads="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:fillViewport="true" >
</ScrollView>
Ở trong phải
là LinearLayout vertical.
Để cuộn ngang
thì ta dùng horizol scroll view như sau
<HorizontalScrollView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fillViewport="true" >
</HorizontalScrollView>
Muốn vừa cuộn
ngang lại cuộn dọc được thì ta phải lồng hai loại với nhau.
Để ví dụ, ta
chọn ảnh to ngang hơn chiều ngang điện thoại, hoặc chỉnh chỉ số width lớn lên.
Ta sửa trong xml thành.
<HorizontalScrollView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fillViewport="true" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:orientation="vertical" >
<ScrollView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:fillViewport="true" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<ImageView
android:id="@+id/img"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:contentDescription="@null"
android:src="@drawable/abc" />
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:contentDescription="@null"
android:src="@drawable/abc" />
</LinearLayout>
</ScrollView>
</LinearLayout>
</HorizontalScrollView>
Chạy thử để
thấy cuộn ngang dọc đều được.
Ta cũng có thể
cho một textView vào trong ScrollView để nếu nội dung dài quá thì có thể cuộn
xuống ở riêng trong textView đó thôi, không cần cuộn tất cả giao diện xuống.
Bài viết rất bổ ích! Cảm ơn tác giả!!
ReplyDelete