Bekerja dengan ScrollView di Android

Bagus Aji Santoso 16 November 2017

Bekerja dengan ScrollView di Android

Pendahuluan

Saat sebuah aplikasi memiliki konten layout yang lebih panjang dari tinggi perangkat Android, maka konten tersebut harus dibuat agar dapat di scroll secara vertikal. Untuk itu kita memerlukan sebuah ScrollView.

img

Penggunaan

Vertically Scrolling

Untuk membuat konten apapun dapat di scroll secara vertikal, cukup bungkus konten tersebut di dalam ScrollView:

<ScrollView
  android:layout_width="match_parent"
  android:layout_height="match_parent">
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical" >   
        
          <TextView
              android:id="@+id/tv_long"
              android:layout_width="wrap_content"
              android:layout_height="match_parent"
              android:text="@string/really_long_string" >
          </TextView>
  
          <Button
              android:id="@+id/btn_act"
              android:layout_width="wrap_content"
              android:layout_height="wrap_content"
              android:text="View" >
          </Button>
    </LinearLayout>
</ScrollView>

Catat bahwa sebuah ScrollView hanya bisa memiliki satu elemen anak jadi, jika menginginkan beberapa elemen sekaligus agar dapat di scroll, bungkus elemen-elemen tersebut menggunakan ViewGroup (RelativeLayout, LinearLayout, atau yang lain).

Dalam beberapa situasi, kita ingin agar ada suatu konten dibagian bawah area yang di scroll. Misalnya kita ingin ada sebuah "term of service" dimana hanya bisa di accept apabila sudah melakukan scroll seluruh konten. Dalam kasus ini, anda mungkin memerlukan properti android:fillViewport menjadi "true". Baca artikel oleh Romain Guy berikut untuk penggunaan yang lebih detail untuk kasus ini.

Scrollable TextView

Catat bahwa sebuah TextView tidak memerlukan ScrollView jika hanya ingin agar teks didalamnya daia di scroll. Cukup gunakan properti scrollbars dan menentukan nilainya:

<TextView
    android:id="@+id/tv_long"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:scrollbars = "vertical"
    android:text="@string/really_long_string" >
</TextView>

dan di Activity:

TextView tv = (TextView) findViewById(R.id.tv_long);
tv.setMovementMethod(new ScrollingMovementMethod());

Sekarang TextView dapat melakukan scroll vertikal secara otomatis tanpa ScrollView

Horizontally Scrolling

Dalam kasus lain, kita ingin agar konten dapat di scroll secara horizontal. Untuk keperluan tersebut kita memerlukan HorizontalScrollView seperti berikut:

<HorizontalScrollView
  android:layout_width="match_parent"
  android:layout_height="match_parent">
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal" >   
        <!-- child views in here -->
    </LinearLayout>
</HorizontalScrollView>

dan sekarang kita sudah memiliki view yang dapat di scroll secara horizontal.

Nested ScrollViews

Membuat sebuah ScrollView didalam ScrollView dapat menyulitkan dan dapat berakhir tidak sesuai harapan. Untuk itu, silahkan gunakan NestedScrollView seperti yang dijelaskan di sini. Sebuah contoh dapat dilihat di sini dan sangat berguna saat bekerja dengan CoordinatorLayout

Diterjemahkan dari Working with the ScrollView.