You are on page 1of 13

Studi Kasus Company Profile

Setup layout anggota dan setup retrofit


Pembuatan detail info company
Pembuatan detail info anggota
Pembuatan admin, custom dialog dan login
Langkah mengerjakan project
1. Membuat File Resource bg_circle_imageview.xml di package drawable
Klik kanan drawable -> klik new -> klik Drawable Resource File, tulis nama
“bg_crcle_imageview”
Kemudian menambahkan atribut/komponen

<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<!--
android:shape
Keyword. Defines the type of shape. Valid values are:
rectangle : A rectangle that fills the containing View.
This is the default shape.
oval : An oval shape that fits the dimensions of the
containing View.
line : A horizontal line that spans the width of the
containing View. This
shape requires the <stroke> element to define the
width of the line.
ring : A ring shape.
-->
<shape android:shape="oval">
<solid android:color="#f3f3f3"/>
<corners android:radius="6dp" />
<stroke
android:width="4dp"
android:color="#fff" ></stroke>
<size android:width="50dp" android:height="50dp"/>
</shape>
</item>
</selector>

2. Membuat file Resource item_anggota di package layout


Klik kanan layout -> klik new -> klik Layout Resource File, tulis nama “item_anggota”
Kemudian menambahkan atribut/komponen

<RelativeLayout
android:layout_marginTop="6dp"
android:layout_marginBottom="6dp"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<LinearLayout
android:layout_marginTop="26dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">

<androidx.cardview.widget.CardView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/card_penulis"
app:cardCornerRadius="4dp"
app:cardElevation="0dp"
android:layout_width="match_parent"
android:layout_height="130dp"
app:cardBackgroundColor="#f3f3f3"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_marginTop="8dp"
android:layout_marginBottom="8dp">

<LinearLayout android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">

<LinearLayout
android:layout_marginTop="38dp"
android:gravity="center"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">

<LinearLayout
android:layout_margin="6dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">

<TextView
android:id="@+id/tv_nama_anggota"
android:layout_marginTop="5dp"
android:gravity="center"
android:ellipsize="marquee"
android:maxLines="2"
android:layout_gravity="center"
android:textSize="16sp"
android:text="Nama"
android:textStyle="bold"
android:layout_width="wrap_content"
android:layout_height="match_parent"
/>
<TextView
android:id="@+id/tv_posisi_anggota"
android:gravity="center"
android:ellipsize="marquee"
android:maxLines="2"
android:layout_gravity="center"
android:textSize="18sp"
android:text="loading.."
android:textStyle="bold"
android:layout_width="wrap_content"
android:layout_height="match_parent"/>

</LinearLayout>

</LinearLayout>

</LinearLayout>

</androidx.cardview.widget.CardView>
</LinearLayout>

<ImageView
android:background="@drawable/bg_circle_imageview"
android:layout_centerHorizontal="true"
android:padding="6dp"
android:src="@mipmap/ic_launcher"
android:id="@+id/img_anggota"
android:adjustViewBounds="true"
android:layout_width="60dp"
android:layout_height="60dp"
/>

</RelativeLayout>

3. Edit file fragment_anggota.xml

<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=".ui.fragment.anggota.AnggotaFragment">

<ImageView
android:layout_width="match_parent"
android:layout_height="170dp"
android:src="@drawable/bg_half_circle" />
<TextView
android:fontFamily="@font/poppinsbold"
android:id="@+id/tv_welcome"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="16dp"
android:text="Selamat Datang"
android:textColor="@color/warnaPutih"
android:textSize="20sp"
android:textStyle="bold" />

<androidx.recyclerview.widget.RecyclerView
android:layout_below="@+id/tv_welcome"
android:layout_margin="16dp"
android:id="@+id/rv_anggota"
android:layout_width="match_parent"
android:layout_height="match_parent"/>

<ProgressBar
android:visibility="gone"
android:layout_centerInParent="true"
android:id="@+id/progress_circular_anggota"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>

</RelativeLayout>

4. Kemudian mengedit file AnggotaFragment.kt

class AnggotaFragment : Fragment() {

override fun onCreateView(


inflater: LayoutInflater, container: ViewGroup?,
savedInstanceState: Bundle?
): View? {
// Inflate the layout for this fragment
return inflater.inflate(R.layout.fragment_anggota, container, false)
}

override fun onViewCreated(view: View, savedInstanceState: Bundle?) {


super.onViewCreated(view, savedInstanceState)

rv_anggota.layoutManager = GridLayoutManager(activity, 2)
getData()

}private fun getData() {


progress_circular_anggota.visibility = View.VISIBLE
ApiRetrofit.create().getData().enqueue(object :
Callback<List<ResponseData>> {
override fun onFailure(call: Call<List<ResponseData>>?, t:
Throwable?) {
progress_circular_anggota.visibility = View.GONE
Toast.makeText(activity,"Gagal dapatkan data",
Toast.LENGTH_LONG).show()
}

override fun onResponse(


call: Call<List<ResponseData>>?,
response: Response<List<ResponseData>>?
) {

if (response?.isSuccessful!!){
progress_circular_anggota.visibility = View.GONE
//tampilkan data nya dibagian ini
val list = ArrayList<ResponseData>()
var dataPosisi = response.body().size
//perulangan untuk data
for (posisi in 0 until dataPosisi){
var dataLooping = response.body().get(posisi)
list.add(dataLooping)
}
var adapterAnggota = AdapterAnggota(list)
rv_anggota.adapter = adapterAnggota

} else{
progress_circular_anggota.visibility = View.GONE
Toast.makeText(activity,"Gagal dapatkan data",
Toast.LENGTH_LONG).show()
}

}
} )
}

5. Menambahkan beberapa atribut di manifest didalam applicaion

android:usesCleartextTraffic="true"

6. Membuat class AdapterAnggota.kt


Klik kanan package anggota -> klik new -> klik Kotlin Class / File , tulis nama
“AdapterAnggota” dengan type file Class.

class AdapterAnggota (val list : ArrayList<ResponseData>)


: RecyclerView.Adapter<AdapterAnggota.MyHolder>() {

inner class MyHolder (itemView: View) : RecyclerView.ViewHolder(itemView){

}
override fun onCreateViewHolder(parent: ViewGroup, viewType: Int):
AdapterAnggota.MyHolder {
val view =
LayoutInflater.from(parent.context).inflate(R.layout.item_anggota,parent,false
)

return MyHolder(view)
}

override fun getItemCount(): Int {


return list.size
}

override fun onBindViewHolder(holder: AdapterAnggota.MyHolder, position:


Int) {

holder.itemView.tv_nama_anggota.text = list[position].nama
holder.itemView.tv_posisi_anggota.text = list[position].jabatan

holder.itemView.setOnClickListener {
val intent = Intent(holder.itemView.context,
DetailAnggotaActivity::class.java)
intent.putExtra("NAMA",list[position].nama)
intent.putExtra("JK",list[position].jk)
intent.putExtra("STATUS",list[position].status)
intent.putExtra("JABATAN",list[position].jabatan)

holder.itemView.context.startActivity(intent)
}

7. Membuat package detail_anggota


Klik kanan package activity -> klik new -> pilih package, tulis nama “detail_anggota”
8. Membuat Activity DetailAnggotaActivity
9. Klik kanan package detail_anggota -> klik new -> pilih Activity -> Empty_Actiivty -> tulis
nama “DetailAnggotaActivity”
10. Menambahkan beberapa komponen pada file activity_detail_anggota.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="match_parent"
android:layout_margin="16dp"
tools:context=".ui.activity.detail_anggota.DetailAnggotaActivity">

<TextView
android:textSize="18sp"
android:id="@+id/tv_nama_anggota_detail"
android:text="Nama"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>

<TextView
android:id="@+id/tv_kelamin_anggota_detail"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Jenis Kelamin"
android:textSize="18sp" />

<TextView
android:textSize="18sp"
android:id="@+id/tv_status_anggota_detail"
android:text="Status"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>

<TextView
android:textSize="18sp"
android:id="@+id/tv_posisi_anggota_detail"
android:text="Posisi"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</LinearLayout>

11. Menambah source code pada file DetailAnggotaAcitivity.kt


class DetailAnggotaActivity : AppCompatActivity() {

override fun onCreate(savedInstanceState: Bundle?) {


super.onCreate(savedInstanceState)
setContentView(R.layout.activity_detail_anggota)
supportActionBar?.setDisplayHomeAsUpEnabled(true)
supportActionBar?.title ="Detail Anggota"

tv_nama_anggota_detail.text = "Nama : "+intent.getStringExtra("NAMA")


tv_kelamin_anggota_detail.text = "Jenis Kelamin :
"+intent.getStringExtra("JK")
tv_posisi_anggota_detail.text = "Jabatan :
"+intent.getStringExtra("JABATAN")
tv_status_anggota_detail.text = "Status :
"+intent.getStringExtra("STATUS")
}
override fun onOptionsItemSelected(item: MenuItem): Boolean {
if (item.itemId == android.R.id.home){
finish()
}
return super.onOptionsItemSelected(item)
}
}

12. Menambahkan theme pada default pada DetailAnggotaActivity di manifest.

<activity android:name=".ui.activity.detail_anggota.DetailAnggotaActivity"
android:theme="@style/AppTheme"
></activity>
13. Membuat Layout item_view_login.xml
Klik kanan Layout -> klik new -> Klik Layout Resource File -> tulis nama “item_view_login”
Lengkapi kode xml pada file item_view_login.xml

<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_margin="16dp"
android:layout_width="match_parent"
android:layout_height="wrap_content">

<EditText
android:layout_marginRight="16dp"
android:layout_marginLeft="16dp"
android:id="@+id/edt_username"
android:hint="Username"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
<EditText
android:layout_marginRight="16dp"
android:layout_marginLeft="16dp"
android:id="@+id/edt_pass"
android:hint="Password"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>

<LinearLayout
android:layout_marginBottom="40dp"
android:layout_marginRight="16dp"
android:layout_marginLeft="16dp"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">

<Button
android:id="@+id/btn_cancel"
android:layout_margin="10dp"
android:layout_weight="1"
android:textColor="#fff"
android:background="#E91E63"
android:text="Cancel"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>

<Button
android:id="@+id/btn_login"
android:layout_margin="10dp"
android:layout_weight="1"
android:textColor="#fff"
android:background="#2196F3"
android:text="Login"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</LinearLayout>

</LinearLayout>

14. Membuat package admin


Klik kanan package acitivity -> klik new -> klik package, tulis nama package “admin”
15. Membuat Activity AdminActivity
Klik kanan package admin -> klik new -> pilih Activitiy -> EmptyActivity, tulis nama
“AdminActivity” bahasa kotlin.
16. Tambahkan kode xml pada file activity_admin.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/white"
tools:context=".ui.activity.admin.AdminActivity">

<androidx.recyclerview.widget.RecyclerView
android:layout_margin="16dp"
android:id="@+id/rv_anggota_admin"
android:layout_width="match_parent"
android:layout_height="match_parent"/>

<ProgressBar
android:visibility="gone"
android:layout_centerInParent="true"
android:id="@+id/progress_circular_anggota_admin"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</RelativeLayout>

17. Menambahkan kode kotlin pada file AdminAcitivity.kt


class AdminActivity : AppCompatActivity() {

override fun onCreate(savedInstanceState: Bundle?) {


super.onCreate(savedInstanceState)
setContentView(R.layout.activity_admin)
supportActionBar?.setDisplayHomeAsUpEnabled(true)
supportActionBar?.title ="Admin Anggota"

rv_anggota_admin.layoutManager = LinearLayoutManager(this)
adminLogin()
//getData()

// override fun onOptionsItemSelected(item: MenuItem): Boolean {


// when(item.itemId){
// R.id.action_add ->{
//
// val intent = Intent(this,
DetailAnggotaAdminActivity::class.java)
// intent.putExtra("NAMA","")
// intent.putExtra("JK","")
// intent.putExtra("STATUS","")
// intent.putExtra("JABATAN","")
// intent.putExtra("FLAG","ADD")
// intent.putExtra("ID","")
//
// startActivity(intent)
// }
// android.R.id.home ->{
// finish()
// }
// R.id.action_refresh ->{
// getData()
// }
// }
//
// return super.onOptionsItemSelected(item)
// }

// override fun onCreateOptionsMenu(menu: Menu?): Boolean {


// val inflater = menuInflater
// inflater.inflate(R.menu.menu_admin, menu)
// return super.onCreateOptionsMenu(menu)
// }

// private fun getData() {


// progress_circular_anggota_admin.visibility = View.VISIBLE
// ApiRetrofit.create().getData().enqueue(object :
Callback<List<ResponseData>> {
// override fun onFailure(call: Call<List<ResponseData>>?, t:
Throwable?) {
// progress_circular_anggota_admin.visibility = View.GONE
// Toast.makeText(this@AdminActivity,"Gagal dapatkan data",
Toast.LENGTH_LONG).show()
// }
//
// override fun onResponse(
// call: Call<List<ResponseData>>?,
// response: Response<List<ResponseData>>?
// ) {
//
// if (response?.isSuccessful!!){
// progress_circular_anggota_admin.visibility = View.GONE
// //tampilkan data nya dibagian ini
// val list = ArrayList<ResponseData>()
// var dataPosisi = response.body().size
// //perulangan untuk data
// for (posisi in 0 until dataPosisi){
// var dataLooping = response.body().get(posisi)
// list.add(dataLooping)
// }
// var adapterAnggota = AdapterAnggotaAdmin(list)
// rv_anggota_admin.adapter = adapterAnggota
// adapterAnggota.notifyDataSetChanged()
//
//
// } else{
// progress_circular_anggota.visibility = View.GONE
// Toast.makeText(this@AdminActivity,"Gagal dapatkan data",
Toast.LENGTH_LONG).show()
// }
//
//
// }
// } )
// }

private fun adminLogin() {

val mDialogView = LayoutInflater.from(this)


.inflate(R.layout.item_view_login, null)

val mBuilder = AlertDialog.Builder(this).setView(mDialogView)


.setTitle("Login Admin")

val mAlerDialog = mBuilder.show()


mAlerDialog.setCancelable(false)

//onclcik button
mDialogView.btn_login.setOnClickListener {
//logic login
var userName = mDialogView.edt_username.text.toString()
var pass = mDialogView.edt_pass.text.toString()

if(userName.isEmpty()){
Toast.makeText(this,"Data tidak bisa kosong",
Toast.LENGTH_LONG).show()
}
else if(pass.isEmpty()){
Toast.makeText(this,"Data tidak bisa kosong",
Toast.LENGTH_LONG).show()
} else{
if (userName.equals("admin") && pass.equals("admin")){
Toast.makeText(this,"Berhasil Login",
Toast.LENGTH_LONG).show()
// UserSession(this).makeSession("admin")
mAlerDialog.dismiss()
} else{
Toast.makeText(this,"Gagal Login",
Toast.LENGTH_LONG).show()
}

}
}
mDialogView.btn_cancel.setOnClickListener {
finish()
}
//validasi untuk cek kalo sudah login
// if (UserSession(this).hasSession()){
// mAlerDialog.dismiss()
// }
}
}

18. Buka file fragment_home.xml


Tambahkan id pada komponen ImageView (yang menampilkan icon setting)

android:id="@+id/img_setting"

19. Buka file HomeFragment.kt


Tambahkan fungsi klik didalam fun onViewCreated (ketika icon setting di klik menampilkan
form login)

img_setting.setOn.javaClickListener {
startActivity(Intent(activity, AdminActivity::class.java))
}

20. Tampilan program ketika di run / dijalankan

Halaman form login admin (ketika icon setting di klik)

Halaman Detail Anggota

You might also like