Android tutorial

How to create awesome home screen UI design

 

Hii Everyone in this Article I, am sharing how to create an Android  App UI Design Like PayTM, and more. today market UI is the most important part of creating an attractive android App hare you can find Create Awesome Home Screen Design in Android. Home Screen is most effective for an App hare you can show all menu. The First Impression is the most important for the attraction of the user.

In these Designs, I am Using ImageSlider and TextView for UI in android. Create Awesome Android App Dashboard UI in Android

Step 1: Start Android Studio and Create a Project in your Android studio.

Setp2: Make an Activity main activity.

Step 3: Open your Manifest file and add user permission.

<uses-permission android:name=“android.permission.INTERNET” />
<uses-permission android:name=“android.permission.ACCESS_NETWORK_STATE” />
<uses-permission android:name=“android.permission.WRITE_EXTERNAL_STORAGE” />
<uses-permission android:name=“android.permission.READ_EXTERNAL_STORAGE” />

Add-In you App Build. Gradle

compile 'com.android.support:appcompat-v7:28.+'
compile 'com.android.support:design:28.+'
compile 'com.android.support:support-v4:28.+'
compile 'com.android.support:cardview-v7:28.+'
compile 'com.android.support:recyclerview-v7:28.+'
compile 'com.squareup.picasso:picasso:2.5.2'
compile 'de.hdodenhof:circleimageview:2.1.0'
compile 'com.daimajia.slider:library:1.1.5@aar'
compile 'com.nineoldandroids:library:2.4.0'
compile 'com.android.volley:volley:1.0.0'

Step 1: Open your Android Studio Create an android project.

In the first step, you can open your android studio and create a project and select an activity.

 Step 2: Open Your XML File and Create a UI With XML.

in your XML file add an Image slider to create an attractive screen show multiple images in Slider.

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

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:paddingBottom="20dp"
                android:background="@color/colorPrimary">
                <android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
                    android:layout_width="match_parent"
                    xmlns:card_view="http://schemas.android.com/apk/res-auto"
                    android:gravity="center"
                    android:layout_marginTop="5dp"
                    android:layout_marginBottom="5dp"
                    android:layout_marginLeft="5dp"
                    android:layout_marginRight="5dp"
                    android:padding="10dp"
                    card_view:cardBackgroundColor="@color/white"
                    android:layout_height="wrap_content"
                    card_view:cardCornerRadius="15dp">
                    <com.daimajia.slider.library.SliderLayout
                        android:id="@+id/sliderLayout"
                        android:layout_width="fill_parent"
                        android:layout_height="150dp" />
                </android.support.v7.widget.CardView>
            </LinearLayout>

After a Slider in your XML file, you can Design a Row same an image.

 <View 
android:layout_width="match_parent" 
android:layout_height="1dp"
android:layout_marginTop="10dp" 
android:background="@color/gree"/> 

<LinearLayout 
android:layout_width="match_parent" 
android:layout_height="100dp" 
android:orientation="horizontal">

 <TextView android:id="@+id/Btn_Profile"
 android:layout_width="match_parent" 
 android:layout_height="match_parent"
 android:gravity="center" 
 android:paddingTop="15dp" 
 android:layout_weight="1"
 android:text="Profile" 
 android:drawableTop="@drawable/icons_administrator_male"/> 
 <View android:layout_width="1dp"
 android:layout_height="match_parent"
 android:background="@color/gree"/>

 <TextView android:id="@+id/Btn_Appoint"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 android:gravity="center"
 android:paddingTop="15dp"
 android:layout_weight="1"
 android:text="Appointment"
 android:drawableTop="@drawable/ic_calendar"/> 

<View
 android:layout_width="1dp"
 android:layout_height="match_parent"
 android:background="@color/gree"/>

 <TextView android:id="@+id/Btn_Visit"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 android:gravity="center"
 android:paddingTop="15dp"
 android:layout_weight="1"
 android:text="Pending \n Visits"
 android:drawableTop="@drawable/ic_treatment"/>

 <View android:layout_width="1dp"
 android:layout_height="match_parent"
 android:background="@color/gree"/>

 <TextView android:id="@+id/Btn_CompleteVisit"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 android:gravity="center"
 android:paddingTop="15dp"
 android:layout_weight="1"
 android:text="Completed \n Visits"
 android:drawableTop="@drawable/icons_checkmark"/>
 </LinearLayout>

 <View
 android:layout_width="match_parent"
 android:layout_height="1dp"
 android:background="@color/gree"/>

Step 3: Open You Java File and implement these.

public class Fragment1 extends Fragment {
    private SliderLayout sliderLayout,sliderLayout1;
    public HashMap<String, Integer> sliderImages;
    public static String EMAIL;
    TextView Btn_Profile,Btn_Appoint,Btn_Visit,Btn_CompleteVisit,;
    CatLoadingView mView;
    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        //just change the fragment_dashboard
        //with the fragment you want to inflate
        //like if the class is HomeFragment it should have R.layout.home_fragment
        //if it is DashboardFragment it should have R.layout.fragment_dashboard
        View rootView = inflater.inflate(R.layout.activity_fragment1, null);
        SessionManagement sessionManagement = new SessionManagement();
        EMAIL = sessionManagement.getSavedEmail(getActivity());
        mView = new CatLoadingView();

        sliderLayout = (SliderLayout) rootView.findViewById(R.id.sliderLayout);
        sliderLayout1 = (SliderLayout) rootView.findViewById(R.id.sliderLayout1);
        sliderImages = new HashMap<>();
        SliaderImage();
        Btn_Profile=(TextView)rootView.findViewById(R.id.Btn_Profile);
        Btn_Profile.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Intent intent=new Intent(getActivity(),Profile.class);
                startActivity(intent);
                getActivity().finish();
            }
        });
        Btn_Appoint=(TextView)rootView.findViewById(R.id.Btn_Appoint);
        Btn_Appoint.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Intent intent=new Intent(getActivity(),Appointment_List.class);
                startActivity(intent);
                getActivity().finish();
            }
        });
        Btn_Visit=(TextView)rootView.findViewById(R.id.Btn_Visit);
        Btn_Visit.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Intent intent=new Intent(getActivity(),Visit_List.class);
                startActivity(intent);
                getActivity().finish();
            }
        });
        Btn_Package=(TextView)rootView.findViewById(R.id.Btn_Package);
        Btn_Package.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Intent intent=new Intent(getActivity(),MyPackage_List.class);
                startActivity(intent);
                getActivity().finish();
            }
        });
        return rootView;

    }

    private void SliaderImage() {
        // progress Dialog
        mView.show(getActivity().getSupportFragmentManager(), "Loading.........");
        mView.setCanceledOnTouchOutside(false);
        final ArrayList arraylist = new ArrayList<HashMap<String, String>>();
// json response code
        StringRequest stringRequest = new StringRequest(Request.Method.POST, ConfiURL.Slider_Image_URL,
                new Response.Listener<String>() {
                    @Override
                    public void onResponse(String response) {

                        try {
                            Log.d("JSON", response);
                            mView.dismiss();
                            JSONObject jsonObject = new JSONObject(response);
                            String error_status = jsonObject.getString("status");
                            if (error_status.equals("0")) {
                                String error_msg = jsonObject.getString("msg");
//                                Toast.makeText(LogIn.this, error_msg, Toast.LENGTH_SHORT).show();
                                ContextThemeWrapper ctw = new ContextThemeWrapper(getActivity(), R.style.Theme_AlertDialog);
                                final android.app.AlertDialog.Builder alertDialogBuilder = new android.app.AlertDialog.Builder(ctw);
                                alertDialogBuilder.setTitle("Message");
                                alertDialogBuilder.setCancelable(false);
                                alertDialogBuilder.setMessage(error_msg);
                                alertDialogBuilder.setPositiveButton("ok", new DialogInterface.OnClickListener() {
                                    public void onClick(DialogInterface dialog, int id) {

                                    }
                                });
                                alertDialogBuilder.show();
                            } else {

                                JSONArray jArray = jsonObject.getJSONArray("allData");
                                int lengthJsonArr = jArray.length();
                                for(int i=0; i < lengthJsonArr; i++)
                                {
                                    HashMap<String, String> map = new HashMap<String, String>();
                                    JSONObject jsonChildNode = jArray.getJSONObject(i);
                                    map.put("CapriSpine", jsonChildNode.getString("banner"));
                                    arraylist.add(map);
                                    for(String name : map.keySet()){
                                        TextSliderView textSliderView = new TextSliderView(getContext());
                                        textSliderView
                                                .description(name)
                                                .image(map.get(name))
                                                .setScaleType(BaseSliderView.ScaleType.Fit);

                                        sliderLayout.addSlider(textSliderView);
                                        sliderLayout1.addSlider(textSliderView);

                                    }
                                    sliderLayout.setPresetTransformer(SliderLayout.Transformer.Accordion);
                                    sliderLayout.setPresetIndicator(SliderLayout.PresetIndicators.Center_Bottom);
                                    sliderLayout.setCustomAnimation(new DescriptionAnimation());
                                    sliderLayout.setDuration(4000);
                                    sliderLayout1.setPresetTransformer(SliderLayout.Transformer.Accordion);
                                    sliderLayout1.setPresetIndicator(SliderLayout.PresetIndicators.Center_Bottom);
                                    sliderLayout1.setCustomAnimation(new DescriptionAnimation());
                                    sliderLayout1.setDuration(8000);
                                }

                            }

                        } catch (Exception e) {
                            Log.d("Tag", e.getMessage());

                        }
                    }
                },
                new Response.ErrorListener() {
                    @Override
                    public void onErrorResponse(VolleyError error) {
                        mView.dismiss();
                        ContextThemeWrapper ctw = new ContextThemeWrapper(getActivity(), R.style.Theme_AlertDialog);
                        final AlertDialog.Builder alertDialogBuilder = new AlertDialog.Builder(ctw);
                        alertDialogBuilder.setTitle("No connection");
                        alertDialogBuilder.setMessage(" Network Timeout  error please try again ");
                        alertDialogBuilder.setPositiveButton("ok", new DialogInterface.OnClickListener() {
                            public void onClick(DialogInterface dialog, int id) {

                            }
                        });
                        alertDialogBuilder.show();

                    }
                }) {
            @Override
            protected Map<String, String> getParams() throws AuthFailureError {
                Map<String, String> map = new HashMap<String, String>();
                return map;
            }
        };

        RequestQueue requestQueue = Volley.newRequestQueue(getActivity());
        requestQueue.add(stringRequest);
    }

}