Pages

Thứ Ba, 18 tháng 6, 2019

ScrollView

ScrollView trong Android

ScrollView là một dạng đặc biệt của FrameLayout ở chỗ nó cho phép người dùng di chuyển qua một danh sách các quan điểm mà chiếm nhiều không gian hơn màn hình vật lý. Các ScrollView có thể chứa chỉ một Child View hay ViewGroup, mà thường là một LinearLayout.

Lưu ý: Không sử dụng một ListView cùng với ScrollView. Các ListView được thiết kế để hiển thị một danh sách các thông tin liên quan và được tối ưu để phù hợp với các danh sách lớn. ScrollView thường dùng để cuộn theo chiều thẳng đứng, nếu muốn cuộn theo chiều ngang chúng ta phải dùng HorizontalScrollView.

Cú pháp:

  <ScrollView  android:id="@+id/scrollView"  android:layout_width="fill_parent"  android:layout_height="fill_parent">      <!-- add child view's here -->       </ScrollView>


Thuộc tính thường dùng của ScrollView
1. android:id: 
Là thuộc tính duy nhất của ScrollView.

  <ScrollView  android:id="@+id/scrollView"  android:layout_width="fill_parent"  android:layout_height="fill_parent"  />

Dựa vào Id ta sẽ lấy được control theo đúng Id này, xem code bên dưới để biết cách lấy control theo Id:

  ScrollView simpleScrollView= (ScrollView ) findViewById(R.id.simpleScrollView);

2. android:scrollbars: Thuộc tính này được sử dụng hiển thị thanh cuộn trong ScrollView, giá trị có thể là "vertical, horizontal" Mặc định cuộn theo thẳng đứng. 

  <ScrollView  android:id="@+id/scrollView"  android:layout_width="fill_parent"  android:layout_height="fill_parent"  android:scrollbars="vertical"/><!--scrollbars in vertical direction-->

Ví dụ: Trong ví dụ này chúng ta sẽ làm ứng dụng gồm có một ScrollView. Trong ScrollView có 10 button và cuộn theo chiều thẳng đứng.Tiến hành tạo project, vào thư mục  res /layout -> activity_main.xml thiết kế giao diện sau:

Bước 1: Tạo một project tên là ScrollViewFile->New->Android Application Project điền các thông tin ->Next ->Finish

Bước 2: Mở res -> layout -> xml (hoặc) activity_main.xml và thêm code trong  Relative Layout.
Chú ý: ScrollView chỉ điều khiển trực tiếp một con, nên để cuộn 10 button chúng ta phải đặt chúng trong Layout

  <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  xmlns:tools="http://schemas.android.com/tools"  android:layout_width="match_parent"  android:layout_height="match_parent"  tools:context=".MainActivity">    <ScrollView  android:layout_width="fill_parent"  android:layout_height="fill_parent"  android:scrollbars="vertical">    <LinearLayout  android:layout_width="fill_parent"  android:layout_height="fill_parent"  android:layout_margin="20dp"  android:orientation="vertical">    <Button  android:layout_width="fill_parent"  android:layout_height="wrap_content"  android:layout_gravity="center"  android:background="#f00"  android:text="Button 1"  android:textColor="#fff"  android:textSize="20sp" />    <Button  android:layout_width="fill_parent"  android:layout_height="wrap_content"  android:layout_gravity="center"  android:layout_marginTop="20dp"  android:background="#0f0"  android:text="Button 2"  android:textColor="#fff"  android:textSize="20sp" />    <Button  android:layout_width="fill_parent"  android:layout_height="wrap_content"  android:layout_gravity="center"  android:layout_marginTop="20dp"  android:background="#00f"  android:text="Button 3"  android:textColor="#fff"  android:textSize="20sp" />    <Button  android:layout_width="fill_parent"  android:layout_height="wrap_content"  android:layout_gravity="center"  android:layout_marginTop="20dp"  android:background="#ff0"  android:text="Button 4"  android:textColor="#fff"  android:textSize="20sp" />    <Button  android:layout_width="fill_parent"  android:layout_height="wrap_content"  android:layout_gravity="center"  android:layout_marginTop="20dp"  android:background="#f0f"  android:text="Button 5"  android:textColor="#fff"  android:textSize="20sp" />    <Button  android:layout_width="fill_parent"  android:layout_height="wrap_content"  android:layout_gravity="center"  android:layout_marginTop="20dp"  android:background="#f90"  android:text="Button 6"  android:textColor="#fff"  android:textSize="20sp" />    <Button  android:layout_width="fill_parent"  android:layout_height="wrap_content"  android:layout_gravity="center"  android:layout_marginTop="20dp"  android:background="#f00"  android:text="Button 7"  android:textColor="#ff9"  android:textSize="20sp" />    <Button  android:layout_width="fill_parent"  android:layout_height="wrap_content"  android:layout_gravity="center"  android:layout_marginTop="20dp"  android:background="#444"  android:text="Button 8"  android:textColor="#fff"  android:textSize="20sp" />    <Button  android:layout_width="fill_parent"  android:layout_height="wrap_content"  android:layout_gravity="center"  android:layout_marginTop="20dp"  android:background="#ff002211"  android:text="Button 9"  android:textColor="#fff"  android:textSize="20sp" />    <Button  android:layout_width="fill_parent"  android:layout_height="wrap_content"  android:layout_gravity="center"  android:layout_marginTop="20dp"  android:background="#0f0"  android:text="Button 10"  android:textColor="#fff"  android:textSize="20sp" />    </LinearLayout>    </ScrollView>    </RelativeLayout>

Bước 3: Mở src -> package -> MainActivity.java

  package hiepsiit.com.scrollview;    import android.app.Activity;  import android.os.Bundle;  import android.view.Menu;  import android.view.MenuItem;    public class MainActivity extends Activity {    	@Override  	protected void onCreate(Bundle savedInstanceState) {  		super.onCreate(savedInstanceState);  		setContentView(R.layout.activity_main);  	}    }

Download ví dụ

Ứng dụng này được phát triển bởi adt bundleandroid 4.2 sử dụng minimum sdk 11  and target sdk 21.


Kết quả khi chạy ứng dụng 



Cập nhật công nghệ từ Youtube tại link: https://www.youtube.com/channel/UCOxeYcvZPGf-mGLYSl_1LuA/videos
Để tham gia khóa học công nghệ truy cập link: http://thuvien.hocviendaotao.com
Mọi hỗ trợ về công nghệ email: dinhanhtuan68@gmail.com