Widget Recent Post No.

header ads

Android UI Design | Modern App UI Design | LearnCode With Rk

 

 Step 1: MAIN.XML


      <?xml version="1.0" encoding="utf-8"?>

<androidx.coordinatorlayout.widget.CoordinatorLayout 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:orientation="vertical"

    tools:context=".home.Home_page">



    <com.google.android.material.appbar.AppBarLayout

        android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:background="#FFFFFF"

        android:theme="@style/Theme.AppCompat"

        app:elevation="0dp">


        <androidx.appcompat.widget.Toolbar

            android:id="@+id/toolbar"

            android:layout_width="match_parent"

            android:layout_height="90dp"

            app:popupTheme="@style/Theme.AppCompat"

            app:theme="@style/Theme.AppCompat">


            <RelativeLayout

                android:layout_width="match_parent"

                android:layout_height="wrap_content">


                <ImageView

                    android:layout_width="60dp"

                    android:layout_height="60dp"

                    android:src="@drawable/logo" />



                <TextView

                    android:layout_width="wrap_content"

                    android:layout_height="wrap_content"

                    android:layout_alignParentStart="true"

                    android:layout_alignParentLeft="true"

                    android:layout_alignParentTop="true"

                    android:layout_marginStart="56dp"

                    android:layout_marginLeft="46dp"

                    android:layout_marginTop="13dp"

                    android:text="Learncode With RK"

                    android:textColor="#000000"

                    android:textSize="22sp"

                    android:textStyle="bold" />




                <ImageView


                    android:id="@+id/share"

                    android:layout_width="36dp"

                    android:layout_height="36dp"

                    android:layout_marginRight="16dp"

                    android:layout_alignParentEnd="true"

                    android:layout_alignParentTop="true"

                    android:src="@drawable/share1"

                    android:layout_marginTop="13dp"

                    android:layout_alignParentRight="true" />


            </RelativeLayout>



        </androidx.appcompat.widget.Toolbar>


    </com.google.android.material.appbar.AppBarLayout>


    <RelativeLayout

        android:layout_width="match_parent"

        android:layout_height="match_parent"

        app:layout_behavior="@string/appbar_scrolling_view_behavior">


        <ScrollView

            android:layout_width="match_parent"

            android:layout_height="wrap_content"

            android:layout_alignParentStart="true"

            android:layout_alignParentTop="true"

            android:layout_alignParentLeft="true">


            <LinearLayout

                android:layout_width="match_parent"

                android:layout_height="wrap_content"

                android:orientation="vertical">


                <HorizontalScrollView

                    android:layout_width="match_parent"

                    android:layout_height="wrap_content"

                    android:scrollbars="none">


                    <LinearLayout

                        android:layout_width="match_parent"

                        android:layout_height="wrap_content"

                        android:layout_marginTop="8sp"

                        android:padding="12dp">




                        <ImageView

                            android:id="@+id/refer_earn"

                            android:layout_width="300dp"

                            android:layout_height="150dp"

                            android:layout_marginRight="4dp"

                            android:src="@drawable/refer" />

                        <ImageView

                            android:id="@+id/affiliate_m"

                            android:layout_width="300dp"

                            android:layout_height="150dp"

                            android:layout_marginRight="4dp"

                            android:src="@drawable/affiliate" />


                    </LinearLayout>



                </HorizontalScrollView>


                <androidx.cardview.widget.CardView

                    android:id="@+id/latest_deals"

                    android:layout_width="match_parent"

                    android:layout_height="wrap_content"

                    app:cardUseCompatPadding="true"

                    app:contentPadding="16dp">


                    <LinearLayout

                        android:layout_width="match_parent"

                        android:layout_height="wrap_content"

                        android:orientation="horizontal"

                        android:weightSum="100">


                        <LinearLayout

                            android:layout_width="0dp"

                            android:layout_height="wrap_content"

                            android:layout_weight="28">


                            <ImageView

                                android:layout_width="72dp"

                                android:layout_height="72dp"

                                android:src="@drawable/youtube" />


                        </LinearLayout>



                        <LinearLayout

                            android:layout_width="0dp"

                            android:layout_height="wrap_content"

                            android:layout_weight="72"

                            android:orientation="vertical">



                            <TextView

                                android:layout_width="wrap_content"

                                android:layout_height="wrap_content"

                                android:layout_marginBottom="6dp"

                                android:text="Latest Deals"

                                android:textColor="#000000"

                                android:textSize="18dp"

                                android:textStyle="bold" />


                            <TextView

                                android:layout_width="wrap_content"

                                android:layout_height="wrap_content"

                                android:layout_marginBottom="4dp"

                                android:text="Know About Latest Offers and Deals"

                                android:textColor="#757575"

                                android:textSize="12dp" />


                            <TextView

                                android:layout_width="wrap_content"

                                android:layout_height="wrap_content"

                                android:text="Subscribe Now >"

                                android:textColor="#3691ea"

                                android:textSize="14dp" />

                        </LinearLayout>


                    </LinearLayout>


                </androidx.cardview.widget.CardView>





                <androidx.cardview.widget.CardView

                    android:layout_width="match_parent"

                    android:layout_height="wrap_content"

                    app:cardUseCompatPadding="true"

                    app:contentPadding="16dp">


                    <LinearLayout

                        android:layout_width="match_parent"

                        android:layout_height="wrap_content"

                        android:layout_marginBottom="16dp"

                        android:orientation="vertical">


                        <LinearLayout

                            android:layout_width="match_parent"

                            android:layout_height="wrap_content"

                            android:layout_marginBottom="32dp"

                            android:orientation="horizontal"

                            android:weightSum="100">


                            <TextView

                                android:layout_width="wrap_content"

                                android:layout_height="wrap_content"

                                android:gravity="left"

                                android:text="Get Started"

                                android:textColor="#322e47"

                                android:textSize="16dp"

                                android:textStyle="bold" />


                        </LinearLayout>


                        <LinearLayout

                            android:layout_width="match_parent"

                            android:layout_height="wrap_content"

                            android:weightSum="100">


                            <LinearLayout

                                android:layout_width="0dp"

                                android:layout_height="wrap_content"

                                android:layout_weight="33.3"

                                android:gravity="center"

                                android:orientation="vertical">


                                <ImageView

                                    android:id="@+id/sign_ups"

                                    android:layout_width="90dp"

                                    android:layout_height="90dp"

                                    android:layout_marginBottom="6dp"

                                    android:src="@drawable/signups" />


                                <TextView

                                    android:layout_width="match_parent"

                                    android:layout_height="wrap_content"


                                    android:gravity="center_horizontal"

                                    android:text="Affiliate\nSign Up"

                                    android:textAlignment="center"

                                    android:textColor="#000000"

                                    android:textSize="16dp" />


                            </LinearLayout>



                            <LinearLayout

                                android:layout_width="0dp"

                                android:layout_height="wrap_content"

                                android:layout_marginLeft="8dp"

                                android:layout_marginRight="8dp"

                                android:layout_weight="33.3"

                                android:gravity="center"

                                android:orientation="vertical">


                                <ImageView

                                    android:id="@+id/log_in"

                                    android:layout_width="90dp"

                                    android:layout_height="90dp"

                                    android:layout_marginBottom="6dp"

                                    android:src="@drawable/login1" />


                                <TextView

                                    android:layout_width="match_parent"

                                    android:layout_height="wrap_content"


                                    android:gravity="center_horizontal"

                                    android:text="Affiliate\nLog in"

                                    android:textAlignment="center"

                                    android:textColor="#000000"

                                    android:textSize="16dp" />


                            </LinearLayout>


                            <LinearLayout

                                android:layout_width="0dp"

                                android:layout_height="wrap_content"

                                android:layout_weight="33.3"

                                android:gravity="center"

                                android:orientation="vertical">


                                <ImageView

                                    android:id="@+id/cus_log"

                                    android:layout_width="90dp"

                                    android:layout_height="90dp"

                                    android:layout_marginBottom="6dp"

                                    android:src="@drawable/paynow" />


                                <TextView

                                    android:layout_width="match_parent"

                                    android:layout_height="wrap_content"

                                    android:gravity="center_horizontal"

                                    android:text="Customer\nLog in"

                                    android:textAlignment="center"

                                    android:textColor="#000000"

                                    android:textSize="16dp" />


                            </LinearLayout>


                        </LinearLayout>


                        <LinearLayout

                            android:layout_width="match_parent"

                            android:layout_height="wrap_content"

                            android:layout_marginTop="16dp"

                            android:weightSum="100">


                            <LinearLayout

                                android:layout_width="0dp"

                                android:layout_height="wrap_content"

                                android:layout_weight="33.3"

                                android:gravity="center"

                                android:orientation="vertical">


                                <ImageView

                                    android:id="@+id/shop"

                                    android:layout_width="90dp"

                                    android:layout_height="90dp"

                                    android:layout_marginBottom="6dp"

                                    android:src="@drawable/shop" />


                                <TextView

                                    android:layout_width="match_parent"

                                    android:layout_height="wrap_content"


                                    android:gravity="center_horizontal"

                                    android:text="Shop"

                                    android:textAlignment="center"

                                    android:textColor="#000000"

                                    android:textSize="16dp" />


                            </LinearLayout>


                            <LinearLayout

                                android:layout_width="0dp"

                                android:layout_height="wrap_content"

                                android:layout_marginLeft="8dp"

                                android:layout_marginRight="8dp"

                                android:layout_weight="33.3"

                                android:gravity="center"

                                android:orientation="vertical">


                                <ImageView

                                    android:id="@+id/support"

                                    android:layout_width="90dp"

                                    android:layout_height="90dp"

                                    android:layout_marginBottom="6dp"

                                    android:src="@drawable/support" />


                                <TextView

                                    android:layout_width="match_parent"

                                    android:layout_height="wrap_content"


                                    android:gravity="center_horizontal"

                                    android:text="Support"

                                    android:textAlignment="center"

                                    android:textColor="#000000"

                                    android:textSize="16dp" />


                            </LinearLayout>


                            <LinearLayout

                                android:layout_width="0dp"

                                android:layout_height="wrap_content"

                                android:layout_weight="33.3"

                                android:gravity="center"

                                android:orientation="vertical">


                                <ImageView

                                    android:id="@+id/trem_condition"

                                    android:layout_width="90dp"

                                    android:layout_height="90dp"

                                    android:layout_marginBottom="6dp"

                                    android:src="@drawable/condition" />


                                <TextView

                                    android:layout_width="match_parent"

                                    android:layout_height="wrap_content"

                                    android:gravity="center_horizontal"

                                    android:text="Terms and conditions"

                                    android:textAlignment="center"

                                    android:textColor="#000000"

                                    android:textSize="16dp" />


                            </LinearLayout>

                        </LinearLayout>


                    </LinearLayout>



                </androidx.cardview.widget.CardView>




                <androidx.cardview.widget.CardView

                    android:id="@+id/web_hosting"

                    android:layout_width="match_parent"

                    android:layout_height="wrap_content"

                    app:cardUseCompatPadding="true"

                    app:contentPadding="16dp">


                    <LinearLayout

                        android:layout_width="match_parent"

                        android:layout_height="wrap_content"

                        android:orientation="horizontal"

                        android:weightSum="100">


                        <LinearLayout

                            android:layout_width="0dp"

                            android:layout_height="wrap_content"

                            android:layout_weight="28">


                            <ImageView

                                android:layout_width="72dp"

                                android:layout_height="72dp"

                                android:src="@drawable/hosting" />


                        </LinearLayout>



                        <LinearLayout

                            android:layout_width="0dp"

                            android:layout_height="wrap_content"

                            android:layout_weight="72"

                            android:orientation="vertical">



                            <TextView

                                android:layout_width="wrap_content"

                                android:layout_height="wrap_content"

                                android:layout_marginBottom="6dp"

                                android:text="Web Hosting"

                                android:textColor="#000000"

                                android:textSize="18dp"

                                android:textStyle="bold" />


                            <TextView

                                android:layout_width="wrap_content"

                                android:layout_height="wrap_content"

                                android:layout_marginBottom="4dp"

                                android:text="Up to 50% OFF Web Hosting plans"

                                android:textColor="#757575"

                                android:textSize="12dp" />


                            <TextView

                                android:layout_width="wrap_content"

                                android:layout_height="wrap_content"

                                android:text="Book Now >>"

                                android:textColor="#3691ea"

                                android:textSize="14dp" />

                        </LinearLayout>


                    </LinearLayout>


                </androidx.cardview.widget.CardView>




                <ImageView

                    android:id="@+id/web_app"

                    android:background="@drawable/web"

                    android:layout_width="wrap_content"

                    android:scaleType="fitXY"

                    android:layout_height="170dp"/>






            </LinearLayout>



        </ScrollView>



    </RelativeLayout>



</androidx.coordinatorlayout.widget.CoordinatorLayout>



Step 2 : MAIN.JAVA


package in.xtremeworkplace.xtremeworkplace.home;


import androidx.appcompat.app.AppCompatActivity;

import androidx.cardview.widget.CardView;


import android.content.Intent;

import android.net.Uri;

import android.os.Bundle;

import android.view.View;

import android.widget.ImageView;

import android.widget.TextView;


import in.xtremeworkplace.xtremeworkplace.R;


public class Home_page extends AppCompatActivity {

    ImageView refer_earn,affiliate_m,sign_ups,log_in,cus_log,shop,trem_condition,support,share,web_app;

    CardView latest_deals,web_hosting;


    @Override

    protected void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_home_page);


        refer_earn = findViewById(R.id.refer_earn);

        affiliate_m = findViewById(R.id.affiliate_m);





        latest_deals = findViewById(R.id.latest_deals);


        sign_ups = findViewById(R.id.sign_ups);

        log_in = findViewById(R.id.log_in);


        cus_log = findViewById(R.id.cus_log);


        shop = findViewById(R.id.shop);


        trem_condition = findViewById(R.id.trem_condition);


        support = findViewById(R.id.support);


        web_hosting = findViewById(R.id.web_hosting);


        web_app = findViewById(R.id.web_app);



        share = (ImageView) findViewById(R.id.share);

        share.setOnClickListener(new View.OnClickListener() {



            @Override

            public void onClick (View v){

                Intent myIntent = new Intent(Intent.ACTION_SEND);

                myIntent.setType("text/plain");

                String shareBody="Your Link";

                String shareSUb="You Subject here";

                myIntent.putExtra(Intent.EXTRA_SUBJECT,shareSUb);

                myIntent.putExtra(Intent.EXTRA_TEXT,shareBody);

                startActivity(Intent.createChooser(myIntent,"Share Using"));



            }


        });




        refer_earn.setOnClickListener(new View.OnClickListener(){

            @Override

            public void onClick(View v) {

                gotoUrl("Your Link");



            }

        });


        affiliate_m.setOnClickListener(new View.OnClickListener(){

            @Override

            public void onClick(View v) {

                gotoUrl("Your Link");



            }

        });



        latest_deals.setOnClickListener(new View.OnClickListener(){

            @Override

            public void onClick(View v) {

                gotoUrl("Your Link");



            }

        });






        sign_ups.setOnClickListener(new View.OnClickListener(){

            @Override

            public void onClick(View v) {

                gotoUrl("Your Link");



            }

        });


        log_in.setOnClickListener(new View.OnClickListener(){

            @Override

            public void onClick(View v) {

                gotoUrl("Your Link");



            }

        });


        cus_log.setOnClickListener(new View.OnClickListener(){

            @Override

            public void onClick(View v) {

                gotoUrl("Your Link");



            }

        });



        shop.setOnClickListener(new View.OnClickListener(){

            @Override

            public void onClick(View v) {

                gotoUrl("Your Link");



            }

        });




        trem_condition.setOnClickListener(new View.OnClickListener(){

            @Override

            public void onClick(View v) {

                gotoUrl("Your Link");



            }

        });



        support = (ImageView) findViewById(R.id.support);

        support.setOnClickListener(new View.OnClickListener() {

            @Override

            public void onClick(View view) {

                Intent streamIntent = new Intent(Home_page.this, feedback.class);

                startActivity(streamIntent);

            }

        });






        web_hosting.setOnClickListener(new View.OnClickListener(){

            @Override

            public void onClick(View v) {

                gotoUrl("Your Link");



            }

        });






        web_app.setOnClickListener(new View.OnClickListener(){

            @Override

            public void onClick(View v) {

                gotoUrl("Your Link");



            }

        });





    }


    private void gotoUrl(String s) {

        Uri uri = Uri.parse(s);

        startActivity(new Intent(Intent.ACTION_VIEW,uri));


    }

}



GITHUB :https://github.com/LearncodeWithRk/Modern-App-UI-Design



Post a Comment

0 Comments