ngodingdulu
ngodingdulu
Mobile DevelopmentSource Code

Source Code Halaman Dashboard UI Android

Oleh Afa Hernandes6 menit baca

Seri · Bagian 9 dari 9Komponen UI Android
  1. 1Cara Membuat Project Baru di Android Studio
  2. 2Membuat Loading/Splash Screen di Android Studio
  3. 3Spinner (Combo Box) di Android: Data Statis & dari JSON
  4. 4Cara Menggunakan RadioButton di Android
  5. 5Cara Membuat Alert Dialog di Android Studio (Lengkap + Loading)
  6. 6Date Picker Dialog di Android
  7. 7Cara Load Gambar dari URL di Android
  8. 8Membuka URL & Aplikasi Lain dari Button Android (Uri.parse)
  9. 9Source Code Halaman Dashboard UI Android

Pada tutorial bahasa pemrograman kali ini, saya akan membagikan sebuah tutorial ngoding dulu tentang bagaimana caranya membuat Halaman Menu Utama yang menarik menggunakan Android Studio dengan mudah. berikut ini adalah contoh source code nya. silahkan dicoba dan dikembangkan dan semoga ilmunya bisa bermanfaat.

Pertama Siapkan dulu gambar yang akan digunakan seperti untuk logo ataupun untuk gambar background dan juga icon yang dibutuhkan.setelah itu masukan gambar/ resource yang diperlukan kedalam folder drawable.(semua nama gambar dan nama layout harus menggunakan huruf kecil tanpa spasi)

Langkah selanjutnya membuat layout. berikut ini adalah source code layout yang saya gunakan. komponen yang dibutuhkan berisi ,CardView, ImageView, ProgressBar dan EditText dll.

tambahkan implementasi CardView didalam build.gradle.

implementation “androidx.cardview:cardview:1.0.0”

copy source code berikut dan beri nama file menuutama.xml didalam folder layout.

menuutama
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_height="fill_parent"
android:layout_width="fill_parent"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:orientation="vertical">


<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:paddingBottom="10dp"
    android:elevation="999dp"
    android:background="@drawable/headerbg2"
    android:gravity="bottom"
    android:paddingLeft="10dp"
    android:paddingRight="10dp">


    <ImageView
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:id="@+id/profile_image"
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:background="@drawable/icaccount"
        android:layout_alignParentBottom="true"/>


    <TextView
        android:layout_marginLeft="15dp"
        android:maxLines="1"
        android:text="Ngodingdulu.com"
        android:textColor="#ffffff"
        android:fontFamily="sans-serif"
        android:textSize="20dp"
        android:gravity="center"
        android:layout_toEndOf="@id/profile_image"
        android:layout_alignParentBottom="true"
        android:layout_toRightOf="@id/profile_image"
        android:layout_height="match_parent"
        android:layout_width="wrap_content" />


</RelativeLayout>
    <androidx.core.widget.NestedScrollView
        android:layout_width="fill_parent"
        android:layout_height="match_parent"
        android:paddingTop="10dp">


<LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="vertical"
        android:weightSum="2"
        android:padding="5dp">


    <androidx.cardview.widget.CardView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_marginBottom="10dp"
        android:minHeight="160dp"
        app:cardBackgroundColor="@color/colorPrimaryDark"
        app:cardCornerRadius="10dp"
        app:cardElevation="10dp"
        app:cardPreventCornerOverlap="false">
        <LinearLayout
            android:layout_margin="15dp"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            android:weightSum="3">
            <LinearLayout
                android:layout_width="0dp"
                android:layout_weight="1"
                android:layout_height="wrap_content"
                android:layout_gravity="center_vertical"
                android:orientation="vertical"
                android:padding="10dp">


                <TextView
                    android:layout_width="185dp"
                    android:layout_height="wrap_content"
                    android:text="APP"
                    android:textColor="@color/white"
                    android:textSize="26sp"
                    android:textStyle="bold" />


                <TextView
                    android:layout_width="188dp"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="5dp"
                    android:text="Introducing APP"
                    android:textColor="@color/white"
                    android:textSize="13sp"
                    android:textStyle="bold" />


            </LinearLayout>


            <ImageView
                android:layout_margin="5dp"
                android:background="#ffffff"
                android:layout_weight="2"
                android:layout_width="0dp"
                android:padding="10dp"
                android:layout_height="120dp"
                android:src="@drawable/logobiru" />
        </LinearLayout>
    </androidx.cardview.widget.CardView>
        <LinearLayout
            android:clipToPadding="false"
            android:gravity="center"
            android:orientation="horizontal"
            android:layout_width="match_parent"
            android:weightSum="2"
            android:layout_height="wrap_content">


            <androidx.cardview.widget.CardView
                android:foreground="?android:attr/selectableItemBackground"
                android:clickable="true"
                android:id="@+id/menu1Card"
                android:layout_width="0dp"
                android:layout_weight="1"
                android:layout_height="160dp"
                android:layout_margin="10dp"
                card_view:cardBackgroundColor="@color/colorWhite"
                card_view:cardCornerRadius="4dp"
                 card_view:cardElevation="10dp"
                card_view:cardPreventCornerOverlap="false" >


                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:orientation="vertical"
                    android:gravity="center">
                    <ImageView
                        android:layout_width="match_parent"
                        android:layout_height="100dp"
                        android:layout_margin="5dp"
                        android:src="@drawable/icon"/>


                    <TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:gravity="center"
                        android:text="Menu 1"
                        android:padding="5dp"
                        android:textColor="@color/colorPrimary"/>


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


            <androidx.cardview.widget.CardView
                android:foreground="?android:attr/selectableItemBackground"
                android:clickable="true"
                android:id="@+id/menu2Card"
                android:layout_width="0dp"
                android:layout_weight="1"
                android:layout_height="160dp"
                android:layout_margin="10dp"
                card_view:cardBackgroundColor="@color/white"
                card_view:cardCornerRadius="4dp"
                card_view:cardElevation="10dp" >


                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:orientation="vertical"
                    android:gravity="center">
                    <ImageView
                        android:layout_width="match_parent"
                        android:layout_height="100dp"
                        android:layout_margin="5dp"
                        android:src="@drawable/icon"/>


                    <TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:gravity="center"
                        android:text="Menu 2"
                        android:padding="5dp"
                        android:textColor="@color/colorPrimary"/>


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


        </LinearLayout>


        <LinearLayout
            android:clipToPadding="false"
            android:gravity="center"
            android:orientation="horizontal"
            android:layout_width="match_parent"
            android:weightSum="2"
            android:layout_height="wrap_content">


            <androidx.cardview.widget.CardView
                android:foreground="?android:attr/selectableItemBackground"
                android:clickable="true"
                android:id="@+id/menu3Card"
                android:layout_width="0dp"
                android:layout_weight="1"
                android:layout_height="160dp"
                android:layout_margin="10dp"
                card_view:cardBackgroundColor="@color/white"
                card_view:cardCornerRadius="4dp"
                card_view:cardElevation="10dp" >


                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:orientation="vertical"
                    android:gravity="center">
                    <ImageView
                        android:layout_width="match_parent"
                        android:layout_height="100dp"
                        android:layout_margin="5dp"
                        android:src="@drawable/icon"/>


                    <TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:gravity="center"
                        android:text="Menu 3"
                        android:padding="5dp"
                        android:textColor="@color/colorPrimary"/>


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


            <androidx.cardview.widget.CardView
                android:foreground="?android:attr/selectableItemBackground"
                android:clickable="true"
                android:id="@+id/menu4Card"
                android:layout_width="0dp"
                android:layout_weight="1"
                android:layout_height="160dp"
                android:layout_margin="10dp"
                card_view:cardBackgroundColor="@color/white"
                card_view:cardCornerRadius="4dp"
                card_view:cardElevation="10dp"
                >


                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:orientation="vertical"
                    android:gravity="center">
                    <ImageView
                        android:layout_width="match_parent"
                        android:layout_height="100dp"
                        android:layout_margin="5dp"
                        android:src="@drawable/icon"/>


                    <TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:gravity="center"
                        android:text="Menu 4"
                        android:padding="5dp"
                        android:textColor="@color/colorPrimary"/>


                </LinearLayout>
            </androidx.cardview.widget.CardView>
        </LinearLayout>
    <TextView
    android:layout_width="fill_parent"
    android:layout_marginTop="40dp"
    android:gravity="center"
    android:textColor="#09246A"
    android:layout_height="wrap_content"
    android:text="Tutorial Bahasa Pemrograman\n2021" />
        </LinearLayout>


    </androidx.core.widget.NestedScrollView>


</LinearLayout>

Source code navigasi nya sebagai berikut. buat didalam Menuutama.java.

Menuutama.java
    CardView menu1=(CardView)findViewById(R.id.menu1Card);
        menu1.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                Intent i=new Intent(Menuutama.this,Profil.class);
                startActivity(i);
            }
        });


        CardView menu2=(CardView)findViewById(R.id.menu2Card);
        menu2.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                Intent i=new Intent(Menuutama.this,Profil.class);
                startActivity(i);
            }
        });


        CardView menu3=(CardView)findViewById(R.id.menu3Card);
        menu3.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                Intent i=new Intent(Menuutama.this,Profil.class);
                startActivity(i);
            }
        });


        CardView menu4=(CardView)findViewById(R.id.menu4Card);
        menu4.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                Intent i=new Intent(Menuutama.this,Profil.class);
                startActivity(i);
            }
        });
#Android
Bagikan:WhatsAppTelegramXFacebook
Cara Membuat Project Baru di Android Studio
MobileTutorial

Cara Membuat Project Baru di Android Studio

Android Studio merupakan software yang cukup populer saat ini untuk membuat aplikasi yang di khususkan untuk perangkat android. kali ini saya akan memberikan tutorial bagaimana cara membuat…

3 Februari 20211 mnt

Enter bukaEsc tutupHalaman pencarian