Lompat ke konten Lompat ke sidebar Lompat ke footer

Cara Membuat Aplikasi Baca Berita Di Android Studio

Cara Membuat Aplikasi Baca Berita Di Android Studio

Pendahuluan

Berita menjadi salah satu informasi yang paling diminati oleh banyak orang, baik itu untuk keperluan pribadi atau pun pekerjaan. Dalam era digital seperti saat ini, membaca berita pun sudah bisa dilakukan melalui aplikasi yang terpasang di smartphone.

Memiliki aplikasi baca berita di smartphone tentu akan memudahkan dan mempercepat akses informasi bagi penggunanya. Oleh sebab itu, di artikel ini akan dibahas tentang cara membuat aplikasi baca berita di Android Studio.

Memulai Project

Android Studio

Langkah pertama yang harus dilakukan sebelum membuat aplikasi baca berita di Android Studio adalah melakukan instalasi software Android Studio pada perangkat komputer atau laptop anda. Setelah itu, buat project baru pada Android Studio dengan cara mengklik File > New > New Project.

Pada tahap selanjutnya, anda dapat mengatur konfigurasi project, seperti nama aplikasi, package name, dan lain-lain. Setelah itu, klik Next dan pilih minimal SDK dengan level 16 atau Android 4.1 (Jelly Bean).

Menambahkan Dependency

Android Studio Dependency

Setelah project dibuat, anda perlu menambahkan dependency pada build.gradle file. Dependency yang dibutuhkan pada aplikasi baca berita ini adalah sebagai berikut:

dependencies {implementation 'androidx.recyclerview:recyclerview:1.2.0'implementation 'androidx.cardview:cardview:1.0.0'implementation 'com.squareup.picasso:picasso:2.5.2'implementation 'com.loopj.android:android-async-http:1.4.10'}

Desain Tampilan

Desain Tampilan Android

Setelah menambahkan dependency, langkah selanjutnya adalah mendesain tampilan aplikasi. Untuk aplikasi baca berita ini, dapat dibuat tampilan seperti berikut:

Tampilan Aplikasi Baca Berita

Tampilan awal aplikasi berisi daftar berita yang dapat di-scroll oleh pengguna. Setiap berita akan ditampilkan dengan gambar, judul, dan deskripsi singkat. Selain itu, juga disediakan fitur search untuk memudahkan pengguna mencari berita yang diinginkan.

Jika pengguna memilih berita yang ingin dibaca, maka akan muncul halaman detail berita, seperti gambar di bawah ini:

Halaman Detail Berita

Koding Aplikasi

Setelah menyelesaikan desain tampilan, langkah selanjutnya adalah membuat kode program. Pada aplikasi baca berita ini, koding yang dibutuhkan dapat dibagi menjadi beberapa bagian, yaitu:

  • Menampilkan daftar berita
  • Membuat fungsi search berita
  • Menampilkan detail berita

Berikut adalah contoh kode program untuk menampilkan daftar berita:

public class MainActivity extends AppCompatActivity {private RecyclerView recyclerView;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);recyclerView = findViewById(R.id.rvBerita);recyclerView.setLayoutManager(new LinearLayoutManager(this));String url = "https://newsapi.org/v2/top-headlines?country=id&apiKey=API_KEY";AsyncHttpClient client = new AsyncHttpClient();client.get(url, new JsonHttpResponseHandler() {@Overridepublic void onSuccess(int statusCode, Headers headers, JSON json) {Gson gson = new Gson();BeritaResponse response = gson.fromJson(json.toString(), BeritaResponse.class);BeritaAdapter adapter = new BeritaAdapter(MainActivity.this, response.getArticles());recyclerView.setAdapter(adapter);}@Overridepublic void onFailure(int statusCode, Headers headers, String response, Throwable throwable) {super.onFailure(statusCode, headers, response, throwable);}});}}

Kode di atas melakukan proses sebagai berikut:

  • Mendefinisikan RecyclerView sebagai tampilan daftar berita
  • Mendapatkan data berita dari API menggunakan library AsyncHttpClient
  • Mengubah data berita menjadi objek menggunakan library Gson
  • Membuat adapter untuk menampilkan daftar berita
  • Mengatur adapter di RecyclerView

Selain menampilkan daftar berita, aplikasi baca berita ini juga dilengkapi dengan fitur search. Berikut adalah contoh kode program untuk membuat fungsi search berita:

public class MainActivity extends AppCompatActivity {private RecyclerView recyclerView;private EditText etSearch;private ArrayList<Article> articles;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);recyclerView = findViewById(R.id.rvBerita);recyclerView.setLayoutManager(new LinearLayoutManager(this));etSearch = findViewById(R.id.etSearch);String url = "https://newsapi.org/v2/top-headlines?country=id&apiKey=API_KEY";AsyncHttpClient client = new AsyncHttpClient();client.get(url, new JsonHttpResponseHandler() {@Overridepublic void onSuccess(int statusCode, Headers headers, JSON json) {Gson gson = new Gson();BeritaResponse response = gson.fromJson(json.toString(), BeritaResponse.class);articles = response.getArticles();BeritaAdapter adapter = new BeritaAdapter(MainActivity.this, articles);recyclerView.setAdapter(adapter);etSearch.addTextChangedListener(new TextWatcher() {@Overridepublic void beforeTextChanged(CharSequence s, int start, int count, int after) {}@Overridepublic void onTextChanged(CharSequence s, int start, int before, int count) {filter(s.toString());}@Overridepublic void afterTextChanged(Editable s) {}});}@Overridepublic void onFailure(int statusCode, Headers headers, String response, Throwable throwable) {super.onFailure(statusCode, headers, response, throwable);}});}private void filter(String text) {ArrayList<Article> filteredList = new ArrayList<>();for (Article article : articles) {if (article.getTitle().toLowerCase().contains(text.toLowerCase())) {filteredList.add(article);}}BeritaAdapter adapter = new BeritaAdapter(MainActivity.this, filteredList);recyclerView.setAdapter(adapter);}}

Kode di atas melakukan proses sebagai berikut:

  • Mendefinisikan EditText sebagai input untuk search
  • Memfilter daftar berita sesuai dengan keyword search yang dimasukkan pengguna
  • Mengatur adapter di RecyclerView sesuai dengan hasil filter

Terakhir, berikut adalah contoh kode program untuk menampilkan detail berita:

public class DetailActivity extends AppCompatActivity {private TextView tvTitle, tvAuthor, tvPublished, tvContent;private ImageView ivBerita;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_detail);tvTitle = findViewById(R.id.tvTitle);tvAuthor = findViewById(R.id.tvAuthor);tvPublished = findViewById(R.id.tvPublished);tvContent = findViewById(R.id.tvContent);ivBerita = findViewById(R.id.ivBerita);Intent intent = getIntent();Article article = (Article) intent.getSerializableExtra("ARTICLE");tvTitle.setText(article.getTitle());tvAuthor.setText(article.getAuthor());tvPublished.setText(article.getPublishedAt());tvContent.setText(article.getContent());Picasso.get().load(article.getUrlToImage()).into(ivBerita);}}

Kode di atas melakukan proses sebagai berikut:

  • Mendapatkan data berita dari intent yang dikirim oleh MainActivity
  • Menampilkan data berita pada tampilan detail

Kesimpulan

Demikianlah cara membuat aplikasi baca berita di Android Studio. Dalam proses pembuatan aplikasi ini, anda perlu memperhatikan desain tampilan, koding aplikasi, serta integrasi dengan API. Dengan mengikuti langkah-langkah yang telah dijelaskan di atas, diharapkan anda dapat membuat aplikasi baca berita yang dapat memudahkan pengguna untuk memperoleh informasi secara cepat dan mudah.

Related video of Cara Membuat Aplikasi Baca Berita Di Android Studio