E-Commerce Android Native App UI Kit

Navigation Bar

To configure the Navigation Bar, follow these steps:

In your app's strings.xml file, add the following strings:

<resources>
    <string name="drawer_open">Open Drawer</string>
    <string name="drawer_close">Close Drawer</string>
</resources>

In your app's styles.xml file, add the following styles:

<resources>
    <!-- Default Theme for the app -->
    <style name="AppTheme" parent="Theme.AppCompat.NoActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>
    <!-- Navigation Bar Theme -->
    <style name="DrawerTheme" parent="Theme.AppCompat.DayNight">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>
</resources>

Drawer Layout

To configure the Drawer Layout, follow these steps:

In your app's activity_main.xml file, add the following layout:

<?xml version="1.0" encoding="utf-8"?>
<androidx.drawerlayout.widget.DrawerLayout
    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/drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <!-- Main content area -->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <!-- Your content goes here -->

    </LinearLayout>

    <!-- Drawer view -->
    <androidx.drawerlayout.widget.DrawerLayout
        android:layout_width="240dp"
        android:layout_height="match_parent"
        android:layout-gravity="start"
        android:id="@+id/left_drawer">
        <!-- Your drawer items go here -->
    </androidx.drawerlayout.widget.DrawerLayout>

</androidx.drawerlayout.widget.DrawerLayout>

Footer Layout

To configure the Footer Layout, follow these steps:

In your app's footer.xml file, add the following layout:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:gravity="center"
    android:orientation="vertical">

    <!-- Footer text -->
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/footer_text"
        android:textSize="16sp"
        android:textStyle="bold" />

</LinearLayout>

Product Card Layout

To configure the Product Card Layout, follow these steps:

In your app's product_card.xml file, add the following layout:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical">

    <!-- Product image -->
    <ImageView
        android:id="@+id/product_image"
        android:layout_width="match_parent"
        android:layout_height="150dp"
        android:scaleType="centerCrop"
        android:src="@mipmap/ic_launcher" />

    <!-- Product name and price -->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">

        <!-- Product name -->
        <TextView
            android:id="@+id/product_name"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:textSize="16sp" />

        <!-- Product price -->
        <TextView
            android:id="@+id/product_price"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textSize="14sp" />

    </LinearLayout>

</LinearLayout>

Toolbar

To configure the Toolbar, follow these steps:

In your app's toolbar.xml file, add the following layout:

<?xml version="1.0" encoding="utf-8"?>
<androidx.appcompat.widget.Toolbar
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/colorPrimary"
    android:elevation="4dp"
    android:theme="@style/ThemeOverlay.AppCompat.ActionBar">

    <!-- Toolbar title -->
    <TextView
        android:id="@+id/toolbar_title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="16sp"
        android:textStyle="bold" />

</androidx.appcompat.widget.Toolbar>

Customizable UI

To customize the UI, you can modify the styles, layouts, and views according to your needs. You can also use custom views and layouts to create a unique design for your app.

Here are the features of the E-Commerce Android Native App UI Kit extracted from the content:

1. More than 45 Screens:
   • Login
   • Register
   • Home
   • Categories
   • Sub Categories
   • Products By Category
   • Product Home
   • Product Details
   • Product Review
   • Brands
   • Brand Home
   • Brand Reviews
   • Brand Details
   • Wishlist Grid & List
   • Chat
   • Filters
   • Inbox
   • Messages
   • Settings
   • Cart
   • Checkout
   • User Account
   • User Orders With Filters
   • App Settings
   • App Languages
   • Help & Supports
2. Over 120 Components:
   • Tabs
   • Sliders
   • Side Menu Hero Animations
   • Search bars
   • Bootton Navigations
3. Shopping or E-Commerce Android Native App UI Kit
4. Entities & Models are ready to use.
5. Clean & organized Android Language code
6. Easy to restyle and theming by on your branding sites.
7. Working fine with bright and dark mode.
8. Awesome animations are ready to use:
   • Hero Animations
   • Parallax Animations
   • Sliding & Swiping animations
9. Working really well on Android with support.

Note that some of these features are listed as bullet points within the "More than 45 Screens" and "Over 120 Components" points.