Kalian ingin membuat tampilan gambar seperti di bawah ini :
Caranya mudah sekali, semudah membuat blank project di Android Studio hehe.. Langsung saja ya, pertama tambahkan de.hdodenhof:circleimageview:2.1.0 di gradle project kalian.
|
1 2 3 4 |
dependencies { ... compile 'de.hdodenhof:circleimageview:2.1.0' } |
Pastikan kalian sudah meng-import file gambar yang akan kalian gunakan.
đź’» Mulai Belajar Pemrograman
Belajar pemrograman di Dicoding Academy dan mulai perjalanan Anda sebagai developer profesional.
Daftar Sekarang
Nah, setelah itu kita atur tampilannya. Disini sengaja saya buat dua versi, dengan dan tanpa ImageCircle.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 |
<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:id="@+id/activity_main" android:layout_width="match_parent" android:layout_height="match_parent" android:paddingBottom="@dimen/activity_vertical_margin" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" android:background="@color/colorAccent" tools:context="com.dicoding.dhahedda.circleimage.MainActivity"> <de.hdodenhof.circleimageview.CircleImageView android:id="@+id/profile_image" android:layout_width="100dp" android:layout_height="100dp" android:src="@drawable/logo" app:civ_border_width="1dp" app:civ_border_color="#ffff00" android:layout_centerVertical="true" android:layout_alignStart="@+id/imageView" /> <ImageView android:layout_width="100dp" android:layout_height="100dp" app:srcCompat="@drawable/logo" android:id="@+id/imageView" android:layout_alignParentTop="true" android:layout_centerHorizontal="true" /> <TextView android:text="Without CircleView" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="36dp" android:id="@+id/textView2" android:layout_alignParentTop="true" android:layout_alignParentStart="true" /> <TextView android:text="Without CirleView" android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/textView" android:layout_centerVertical="true" android:layout_alignParentStart="true" /> </RelativeLayout> |
Kurang lebih tampilannya seperti ini :
That’s it. Simpel kan? Ok Semoga bermanfaat.
Oh iya jika ada masukan ataupun saran silahkan comment ya, kalian juga boleh request tips loh, so jangan sungkan. Sampai jumpa di dicoding tips selanjutnya.
