Thursday, July 19, 2018

Scrolling Text menggunakan Android Studio

Tutorial membuat Scrolling Text menggunakan Android Studio untuk pemula.

Yang harus sudah Anda KETAHUI

 Dari praktik sebelumnya, Anda harus sudah bisa:

  • Membuat aplikasi Hello World dengan Android Studio. 
  • Menjalankan aplikasi di emulator atau perangkat. 
  • Mengimplementasikan TextView dalam layout untuk aplikasi. 
  • Membuat dan menggunakan sumber daya string. 
  • Mengonversi dimensi layout ke sumber daya. 
Yang akan Anda PELAJARI Pengantar

Anda akan belajar:
  • Menggunakan kode XML untuk menambahkan beberapa elemen TextView. 
  • Menggunakan kode XML untuk menentukan tampilan bergulir. 
  • Menampilkan teks bentuk bebas dengan beberapa tag pemformatan HTML. 
  • Menata gaya warna latar belakang dan warna teks TextView. 
  • Menyertakan tautan web di teks. 
Yang akan Anda LAKUKAN Dalam praktik ini Anda akan:
  • Membuat aplikasi Scrolling Text. 
  • Menambahkan dua elemen TextView untuk heading dan subheading artikel. 
  • Menggunakan gaya dan warna TextAppearance untuk heading dan subheading artikel. 
  • Menggunakan tag HTML dalam string teks untuk mengontrol pemformatan. 
  • Menggunakan atribut lineSpacingExtra untuk menambahkan spasi baris agar meningkatkan keterbacaan. 
  • Menambahkan ScrollView ke layout untuk mengaktifkan pengguliran elemen TextView. Menambahkan atribut autoLink untuk mengaktifkan URL di teks agar aktif dan bisa diklik. 
Ringkasan Aplikasi
        Aplikasi Scrolling Text memperagakan komponen UI ScrollView. ScrollView adalah ViewGroup yang dalam contoh ini berisi TextView. ScrollView menunjukkan halaman teks panjang, dalam hal ini ulasan album musik, yang dapat digulir pengguna secara vertikal untuk dibaca dengan mengusap layar ke atas dan ke bawah. Bilah gulir muncul di margin kanan. Aplikasi ini menunjukkan cara menggunakan teks berformat dengan tag HTML minimal untuk mengubah teks menjadi cetak tebal atau miring, dan dengan karakter baris baru untuk memisahkan paragraf. Anda juga bisa menyertakan tautan web aktif dalam teks.
 
 
 
Tugas 1: Menambahkan beberapa tampilan teks Dalam praktik ini Anda akan membuat proyek Android untuk aplikasi Scrolling Text, menambahkan TextView ke layout untuk judul dan subjudul artikel, dan mengubah elemen TextView "Hello World" yang sudah ada untuk menunjukkan artikel yang panjang. Gambar di bawah ini adalah diagram layout.
 
 
 Anda akan membuat semua perubahan ini dalam kode XML dan di file strings.xml. Anda akan mengedit kode XML untuk layout di panel Text, yang ditunjukkan dengan mengeklik tab Text tab, bukan dengan mengeklik tab Design untuk panel Design. Beberapa perubahan pada elemen dan atribut UI lebih mudah dibuat langsung pada panel Text menggunakan kode sumber XML.
 
Membuat proyek dan elemen TextView 

1. Di Android Studio, buat proyek baru dengan parameter berikut:
 
 
 2. Pada folder app > res > layout, buka file activity_main.xml, dan klik tab Text untuk melihat kode XML jika belum dipilih. ketikan script dibawah ini :
 
 
 
 3. Tambahkan elemen TextView di atas TextView "Hello World". Saat Anda memasukkan , which is shorthand for . Tambahkan atributatribut berikut ke TextView:
 
 
 
 4. Ekstrak sumber daya string untuk string yang di-hardcode "Article Title" atribut android:text dalam TextView untuk membuat entri untuknya di strings.xml

Letakkan kursor di string yang di-hardcode, tekan Alt-Enter (Option-Enter di Mac), dan pilih Extract string resource.
 Lalu edit nama sumber daya untuk nilai string ke article_title. Tip: Sumber daya string dijelaskan secara detail di dokumentasi Sumber Daya String.

5. Ekstrak sumber daya dimensi untuk string "10dp" hard-code atribut android:padding dalam TextView untuk membuat entri di dimens.xml

. Letakkan kursor di string hard-code, tekan Alt-Enter (Option-Enter di Mac), dan pilih Extract dimension resource.
Lalu edit name Sumber Daya ke padding_regular.

6. Tambahkan elemen TextView TextView di atas "Hello World" TextView bawah TextView yang Anda buat pada langkah sebelumnya. Tambahkan atribut-atribut berikut ke TextView :
 
 
 
 Perhatikan karena Anda mengekstrak sumber daya dimensi untuk string "10dp" ke padding_regular pada TextView yang sebelumnya dibuat, Anda bisa menggunakan "@dimen/padding_regular" untuk atribut android:padding dalam TextView ini.

7. Ekstrak sumber daya string untuk string "Article Subtitle" yang di-hardcode atribut android:text dalam TextView ke article_subtitle.

8. Tambahkan atribut-atribut TextView berikut ke elemen TextView "Hello World", dan ubah atribut
 
 
 
 9. Ekstrak sumber daya string untuk "Article text" ke article_text, dan ekstrak sumber dimensi "5sp" ke line_spacing.

10. Format ulang dan ratakan kode dengan memilih Code > Reformat Code. Sebaiknya format ulang dan ratakan kode agar memudahkan Anda dan orang lain memahaminya.

11. kemudian buka strings.xml:

12. jalankan aplikasi nya
 

No comments:

Post a Comment