Tutorial Samsung Galaxy SDK : S Pen Features

Kami telah membuat tulisan sebelumnya mengenai Tutorial Instalasi Samsung Galaxy SDK di link berikut: https://www.dicoding.com/blog/tutorial-samsung-galaxy-sdk-instalasi/

Tutorial lengkap dari penggunaan Samsung Galaxy SDK dapat anda pelajari lebih mendalam di Dicoding Academy Samsung Galaxy SDK: https://www.dicoding.com/academies/37

S Pen adalah perangkat keras yang diperkenalkan serta diluncurkan pertama kali oleh Samsung pada peluncuran GalaxyNote. Alat ini adalah sebuah hardware untuk melakukan input. Fungsi dan Sensasi penggunaannya hampir sama dengan pena  sebenarnya. S Pen memberikan pengalaman yang lebih kepada pengguna karena memiliki beberapa fitur misalnya adalah keakuratan presisi, memiliki feel yang sama seperti menulis pada kertas, dan fitur editing lainnya seperti writing dan shapes. Cara kerja alat ini cukup sederhana yaitu dengan mendeteksi tekanan yang dibenamkan di dalam layar yang cukup lebar. Akurasi atau ketepatan yang ditanamkan juga mendekati sempurna.

💻 Mulai Belajar Pemrograman

Belajar pemrograman di Dicoding Academy dan mulai perjalanan Anda sebagai developer profesional.

Daftar Sekarang

Untuk mengembangkan aplikasi yang memanfaatkan S Pen, Samsung sendiri telah menyediakan Pen SDK. Penggunaan dari Pen SDK meliputi beberapa hal yaitu:

  • Advanced editing (handwritings, drawing, dan shapes)
    Pen SDK dapat melakukan edit secara advance dengan menggunakan pen pada layar yang kecil. Advanced editing meliputi objek-objek dasar seperti handwritings, drawing, atau shapes dan bisa kita select menggunakan rectangle / box atau arbitary shape menggunakan laso. Setelah diselect kita bisa mengganti propertiesnya seperti group/ungroup, mengganti z-order, menggati warna, dll. Contoh ilustrasi dari advanced editing pada Pen SDK.

a

  • Recognition based shape editing (Mengenali bentuk)
    Selain menggunakan editing shape kita bisa menggunakan fitur shape recognition yaitu dengan menginputkan suatu gambar menggunakan pen maka gambar itu akan di kenali dengan shape yang menyerupai gambar tersebut, misal kita ingin membuat lingkaran maka kita tinggal menggambarkan garis yang mirip lingkaran pada layar maka secara otomatis akan dikenali sebagai lingakaran dan di transform menjadi lingkaran yang sempurna. Setelah shapes bisa dikenali maka kita melakukan editing terhadap shapes dengan fitur-fitur editing. Ilustrasi dari shape recognition seperti berikut:

b

  • General recognition (Mengenali Tulisan)
    Recogniton yang ini digunakan untuk mengenali tulisan yang kita inputkan dengan menggunakan pen. Seperti contohnya dibawah yaitu text yang dituliskan oleh user dapat dikenali sebagai kata sehingga kita bisa mengaplikasikan fungsi search ke dalam tulisan text yang kita inputkan dengan menggunakan pen.

c

Masih banyak lagi fitur-fitur lain yang tersedia di dalam Pen SDK. Pen SDK masih tetap bisa digunakan meskipun devices tidak support built-in S Pen, sebagai gantinya kita bisa menggunakan sensor sentuh yaitu jari tangan, tentunya masukan dari jari tangan memiliki limitasi seperti pressure (tekanan) yang hanya bisa aplikasikan pada S Pen.

Pemanfaatan S Pen

S Pen dapat digunakan dalam berbagai macam aplikasi. Berikut ini contoh pemanfaatan S Pen:

  1. Gambar (Drawing)
    S Pen memberikan pengguna kemampuan untuk membuat corat-coret sederhana sampai sketsa rumit.
    f
  2. Menulis Pesan (Note Taking)
    Fleksibilitas dalam menulis catatan menggunakan perangkat elektronik. S Pen mampu memberikan kenyamanan dengan penggunaan notepad yang praktis kapan saja.
    g
  3. Mengedit Foto (Photo Editing)
    Untuk memodifikasi gambar di butuhkan alat yang akurat, S Pen dapat memberikan hal tersebut.
    h
  4. Mengatur Device (Device Control)
    Mengendalikan perangkat hampir seluruhnya menggunakan S Pen dari simulasi menekan tombol hingga mengambil screenshot.
    i
  5. Permainan (Gaming)
    Mendapatkan kemenangan dalam persaingan, S Pen menawarkan kontrol sentuh yang lebih tepat untuk game yang menuntut itu.

 

Penggunaan dan Fungsionalitas Pen SDK

Beberapa penggunaan dan fungsionalitas dari Pen SDK yang bisa kamu implementasikan untuk mengembangkan sebuah aplikasi adalah sebagai berikut:

  1. SDK View
    SpenSurfaceView, yang mewarisi dari Android SurfaceView, memproses gerakan jari atau masukan S Pen di area viewport. SpenSurfaceView juga mengubah masukan tulisan tangan ke teks atau memasukkan kembali masukan pengguna. SpenSurfaceView adalah komponen tampilan dalam paradigma model-view-controller, dan ini menghasilkan representasi data obyek pada viewport. SpenSurfaceView menyediakan kontrol untuk penskalaan, putaran, pergerakan, dan control untuk memilih objek.
    SpenSurfaceView dan SpenSettingPenLayout di gabungkan untuk menyediakan metode untuk mengelola preferensi pengguna perihal font, ukuran font, dan warna font; Ukuran, warna, atau jenis alat pena; Ukuran alat penghapus; dan pilihan untuk objek.
    Apa saja yang bisa di gunakan Pen SDK Views adalah sebagai berikut:
    • Menggambar di layar dengan menggunakan S Pen
      Kamu dapat menggunakan S Pen dengan beberapa tools yang tersedia untuk menggambar di layar.
    • Menambahkan Setting Pen SDK
      Kamu dapat menambahkan tombol pengaturan pena ke aplikasi Anda untuk menyetel preferensi pengguna untuk ukuran pena, warna dan jenis.
    • Menambahkan Setting Eraser
      Anda dapat menambahkan tombol pengaturan penghapus ke aplikasi Anda untuk mengkonfigurasi pengaturan penghapus dan menyimpan konfigurasinya ke SpenSurfaceView dengan kelas SpenSettingEraserLayout.
    • Menambahkan fungsi Undo dan Redo
      Pen SDK menghasilkan riwayat untuk setiap aksi yang di lakukan oleh pengguna. Pengelolaan riwayat memungkinkan Anda menambahkan fitur undo atau redo ke dalam aplikasi.
    • Mengatur Background
      Anda dapat memilih gambar dari galeri dan menggunakannya sebagai latar belakang aplikasi Anda dengan menggunakan SpenPageDoc.setBackgroundImage().
    • Replay Animations
      SDK Pen memungkinkan Anda memutar ulang gambar atau pengeditan teks di dalam aplikasi. Anda dapat menambahkan fitur animasi replay ke aplikasi Anda dengan menggunakan SpenPageDoc.startRecord(), SpenPageDoc.stopRecord(), SpenSurfaceView.startReplay(), SpenSurfaceView.stopReplay (), dan metode terkait replay lainnya.
    • Menangkap Screenshot
      PenSDK memungkinkan Anda mengambil screen shot dan menyimpannya sebagai file gambar. Anda dapat menerapkan fungsi ini di aplikasi Anda dengan menggunakan penSurfaceView.captureCurrentView(), yang membuat bitmap dari SpenSurfaceView.
    • Menggunakan Custom Drawing
      Pen SDK juga menawarkan fitur Custom Drawing. Gunakan SpenSurfaceView.setPreDrawListener() dan SpenView.setPostDrawListener() untuk menambahkan beberapa gambar khusus pada instance SpenSurfaceView.

     

  2. SDK Documents
    SDK Documents adalah komponen Pen SDK yang bisa digunakan untuk menambahkan dan menghapus sebuah objek, menyimpan dan membuka file, dan mengelola riwayat (history). Dengan menggunakan methods documents, aplikasi Anda dapat menawarkan beberapa fitur berikut:
    • Menambah, menghapus, atau menyimpan goresan, gambar, dan objek teks sebagai file
    • Menambahkan data tambahan atau file saat menyimpan objek
    • Membuka dan mengedit file yang disimpan
    • Mengatur riwayat untuk perintah undo dan redo
    • Satu hal yang harus di perhatikan, riwayat states tidak bisa di simpan sebagai file.
  3. SDK Select Object
    Pen SDK memungkinkan Anda mengubah ukuran, merelokasi, atau memutar objek yang ditambahkan ke instance SpenSurfaceView, dan group maupun ungroup beberapa objek. Anda dapat menggunakan SpenPageDoc.moveObjectIndex() untuk mengedit urutan objek di instance SpenPageDoc.
  4. S Pen Object Runtime
    S Pen Object Runtime (SOR) adalah plug-in untuk memperluas kemampuan default preloadedobjects seperti SpenObjectStroke, SpenObjectText, SpenObjectImage, dan SpenObjectContainer yang secara native di pasok oleh Pen SDK secara real-time. Anda dapat membuat SOR dengan SpenObjectRuntimeManager dengan memanggil SpenObjectRuntimeManager.createObjectRuntime(). Pen SDK mengembalikan instance SpenObjectRuntime yang Anda buat. Anda memerlukan objek SpenObjectRuntimeInfo atau nilai nama kelas SOR untuk memanggil createObjectRuntime(). Jika SOR memiliki private key, private key harus di kirim.
  5. Advance Pen SDK Features
    SDK Pen juga menawarkan fitur lanjutan untuk aplikasi Anda:
    • Smart Scroll
      Anda dapat menggunakan Smart Scroll untuk mengaktifkan pengguliran horizontal atau vertikal secara otomatis saat S Pen melayang di dekat tepi layar.
    • Smart Zoom
      Untuk mendefinisikan ulang area Smart Scroll saat orientasi halaman (landscape dan portrait) berubah, override methods onConfigurationChanged().
    • Translucent View
      Anda dapat menggunakan Pen SDK untuk menyajikan Simple View di aplikasi Anda. Simple View menciptakan memo dengan SpenObjectStroke dengan memasukkan contoh SpenSimpleView di atas instance SpenSurfaceView utama.

Perbedaan Pen Light SDK dan Pen SDK

Ada 2 macam SDK yang bisa kita gunakan untuk untuk mengembangkan Pen, yaitu Pen Light SDK dan Pen SDK. Perbedaan fungsionalitas antara keduanya bisa di lihat di tabel berikut:

d

Dari tabel di atas dapat di lihat bahwa semua fungsi pada SDK Light ada pada SDK Pen full. SDK Light dapat kita gunakan jika aplikasi kita hanya membutuhkan sedikit fitur dari Pen SDK dan ingin menjaga ukuran file APK agar sekecil mungkin.

Device Support

Untuk menggunakan Pen SDK, devices yang digunakan adalah minimal Android 4.0 (Ice Cream Sandwich API level 14). Seperti yang telah di jelaskan sebelumnya beberapa fungsi seperti pressure atau hover akan terlimitasi pada device tanpa built-in S Pen.

Latihan

Untuk lebih mengenal bagaimana penerapan Pen SDK, kita akan coba membuat aplikasi Paint sederhana dengan menggunakan beberap fitur dari Pen SDK. Kali ini kita menggunakan Pen SDK.

  1. Buat Project baru dan beri nama PenSample.
    Pastikan kamu telah memasukkan library Pen SDK ke dalam project kamu. Pada latihan kali ini kita akan menggunakan Pen SDK full version. Untuk instalasi Samsung SDK dan cara memasukkan library SDK terkait ke dalam project telah kita bahas di artikel sebelumnya (https://www.dicoding.com/blog/tutorial-samsung-galaxy-sdk-instalasi/)
    1
  2. Pada build.gradle(App) tambahkan baris code berikut:

    Jangan lupa untuk sync gradle nya.
  3. Tambahkan beberapa permission ke dalam android manifest, codenya seperti berikut:

    Permission WRITE_USE_APP_FEATURE_SURVEY adalah permission wajib yang harus ada ketika menggunakan Samsung SDK.
  4. Tambahkan juga beberapa string ke dalam res->value->strings.xml. String ini nantinya akan di gunakan dalam layout tampilan projek ini.
  5. Untuk tampilan layout xml, bisa kita kondisikan menjadi seperti berikut ini :
    2

  6. Selanjutnya kita kondisikan kelas MainActivity.java, kita mulai dengan menambahkan variable global di dalamnya.

    Selanjutnya pada method onCreate(), ada beberapa baris code yang harus kita tambahkan. Code ini digunakan untuk menginisialisasi kelas Spen, fungsinya untuk mengecek apakah device yang akan di gunakan support dengan Pen SDK atau tidak.

    Inisialisasi komponen-komponen layout seperti FrameLayout, MPenSettingView, MSpenSurfaceView, dan MSpenPageDoc dengan menambahkan beberapa baris code berikut:

    Terakhir di dalam method onCreate yang harus di tambahkan adalah mengatur default setting dari pen dan erase, register setiap listener, inisialisasi button, dan set default ke pen ketika pertama kali di jalankan.

    Tambahkan method baru initSettingInfo() fungsinya untuk menginialisasikan atau men-setting default setting dari Pen dan Eraser, kodenya dapat di sesuaikan sebagai berikut:

  7. Setelah mengatur default awal Pen dan Eraser, sekarang tambahkan listener untuk Pen dan Eraser.
  8. Sekarang tambahkan beberapa method untuk mengatur aktif dan tidaknya button ketika sedang melakukan drawing dengan menambahkan method-method di bawah ini:
  9. Agar tidak terjadi memory over leaks maka kita perlu membebaskan memory yang kita pakai ketika aplikasi sudah tidak berjalan. Tambahkan beberapa baris kode ke dalam override method onDestroy seperti ini:
  10. Konfigurasi untuk Pen dan Eraser selesai, sekarang coba jalankan aplikasinya !
    8
    Ketika menekan button Pen atau double klik pada button Eraser, maka akan muncul tampilan setting seperti di bawah ini:
    4 5
  11. sini Anda telah berhasil menggunakan fitur Pen dan Eraser, sekarang bagaimana cara untuk menyimpan (Save) dan menampilkan kembali apa yang telah kita simpan (Load) akan di jelaskan di point berikutnya. Ketika menyimpan file di butuhkan layout baru untuk menampilkan dialog, maka dari itu buat layout baru dan beri nama save_file_dialog.xml, sesuaikan codenya menjadi seperti berikut:
  12. Ketika melakukan penyimpanan maupun pemanggilan, yang harus dilakukan pertama kali adalah melakukan pengecekan untuk mengakses permission pada device, maka dari itu kita akan menambahkan method checkPermission(). Sesuaikan kodenya seperti berikut:
  13. Tambahkan override method onRequestPermissionResult() yang berfungsi sebagai callback ketika pengguna menekan “allow” saat dialog permission muncul.
  14. Sekarang kita akan menambahkan listener untuk button save dan load. Untuk listener save sesuaikan kodenya seperti berikut:

    Kemudian untuk load, sesuaikan kodenya adalah seperti berikut:
  15. Pada method onCreate, jangan lupa daftarkan inisialisasi button save dan load yang akan kita gunakan beserta listenernya.

     
  16. Kita juga akan memanfaatkan method dari activity onBackPressed yang digunakan untuk konfirmasi ketika pengguna akan menutup aplikasi, akan muncul dialog apakah data akan di save terlebih dahulu.
  17. Sekarang kita coba jalankan lagi aplikasinya. Coba gunakan tombol save dan load yang telah kita buat. Tampilan aplikasi ketika ingin save data:
    6
    Kita bisa memilih format atau tipe file yang ingin kita simpan. Sementara itu, tampilan aplikasi ketika load data:
    7 8

Masih banyak fitur menarik di Pen SDK yang belum kita bahas di sini, untuk pembahasan lebih jauh silakan kunjungi akademi Samsung Galaxy SDK (https://www.dicoding.com/academies/37). Jika ada pertanyaan, saran atau masukan jangan sungkan untuk menuliskannya di kolom komentar.

Selamat belajar, semoga bermanfaat, dan nantikan tutorial Samsung Galaxy SDK selanjutnya.


Belajar Pemrograman Gratis
Belajar pemrograman di Dicoding Academy dan mulai perjalanan Anda sebagai developer profesional.