Developing the Unit Converter App in Android<\/h3>\n
Ok, so before getting to implement the game directly we\u2019ll understand the files that we have created for this application. Let us see them one by one<\/p>\n
- \n
- The first file that we have created is activity_splash.xml, this file will manage the interface of our splash screen.<\/li>\n
- The next file is SplashActivity.java file. This file will handle the working of the splash screen.<\/li>\n
- The next file is activity_main.xml which will contain the code of the UI of our dashboard. In this screen, we will have different categories.<\/li>\n
- The next file is the MainActivity.java file. This file will handle the working of the above file. It will redirect the user to the next screen depending on the category he has chosen.<\/li>\n
- Next we have to create different xml files for handling the UI of our categories. And we have to create the corresponding java files which will handle the code for unit conversion.<\/li>\n
- Then we have developed some other files that were required for the interface of application that is listed below:\n
- \n
- colors.xml: This file has the colors described so it would be easy to mention the color name to recognize it.<\/li>\n<\/ol>\n<\/li>\n<\/ol>\n
Download Android Unit Converter Project Source Code<\/h3>\n
Now, for the implementation of the Android Unit Converter App, please download the project code: Android Unit Converter App Code<\/strong><\/a><\/p>\n
Once you have downloaded the TechVidvan Unit Converter project, you can proceed with the following steps:<\/p>\n
1. Once the project is downloaded, you need to extract it in the desired file location. Open the source code zip file and extract:<\/p>\n
![\"extract](\"https:\/\/techvidvan.com\/tutorials\/wp-content\/uploads\/sites\/2\/2022\/02\/extract-project-code.webp\")
<\/a><\/p>\n2. Once you have extracted the file, please import the project in Android Studio.<\/p>\n
3. Now once the project is extracted, you are ready to execute the TechVidvan Unit Converter project. Upon running the app we\u2019ll find the result as follows:<\/p>\n
a. This is the dashboard of our application<\/p>\n
![\"android](\"https:\/\/techvidvan.com\/tutorials\/wp-content\/uploads\/sites\/2\/2022\/02\/android-unit-converter-dashboard.webp\")
<\/a><\/p>\nb. If you click on temp button, you will be redirected to this screen.<\/p>\n
![\"temperature](\"https:\/\/techvidvan.com\/tutorials\/wp-content\/uploads\/sites\/2\/2022\/02\/temperature-unit-conversion.webp\")
<\/a><\/p>\nc. You will select the units in which you want to convert the value into and you will click the convert button:<\/p>\n
![\"temperature](\"https:\/\/techvidvan.com\/tutorials\/wp-content\/uploads\/sites\/2\/2022\/02\/temperature-selection.webp\")
<\/a><\/p>\nHow to make a Unit Converter application?<\/h3>\n
Open Android Studio, create a new project > select Empty Activity > click on next button > give it a name \u201cTechVidvan Unit Converter\u201d > click on finish.<\/p>\n
![\"create](\"https:\/\/techvidvan.com\/tutorials\/wp-content\/uploads\/sites\/2\/2022\/02\/create-new-android-project.webp\")
<\/a><\/p>\n1. Let\u2019s first Make a Splash Screen for our app \u2013<\/strong><\/p>\n
Splash Screen –<\/strong> A splash screen is a screen that appears when you open an app on your mobile device. Sometimes it\u2019s referred to as a launch screen or startup screen and shows up when your app is loading after you\u2019ve just opened it.<\/p>\n
Right Click on source package -> new -> Activity -> Empty Activity -> name it \u201cSplash Screen\u201d.<\/strong><\/p>\n
![\"new](\"https:\/\/techvidvan.com\/tutorials\/wp-content\/uploads\/sites\/2\/2022\/02\/new-activity-image.webp\")
<\/a><\/p>\nGo to res->drawable folder and paste icon image (this is the logo of unit conversion app)<\/p>\n
Before you start writing code, let\u2019s add some colors that we will be using in our project.<\/p>\n
Go to res -> values -> color.xml, add the following code<\/p>\n
![\"colors](\"https:\/\/techvidvan.com\/tutorials\/wp-content\/uploads\/sites\/2\/2022\/02\/colors-xml-image.webp\")
<\/a><\/p>\n<?xml version=\"1.0\" encoding=\"utf-8\"?>\r\n<resources>\r\n<color name=\"purple_200\">#FFBB86FC<\/color>\r\n<color name=\"purple_500\">#FF6200EE<\/color>\r\n<color name=\"purple_700\">#FF3700B3<\/color>\r\n<color name=\"teal_200\">#FF03DAC5<\/color>\r\n<color name=\"teal_700\">#FF018786<\/color>\r\n<color name=\"black\">#FF000000<\/color>\r\n<color name=\"white\">#FFFFFFFF<\/color>\r\n<color name=\"grey\">#808080<\/color>\r\n<color name=\"hintColor\">#808080<\/color>\r\n<color name=\"background\">#FFFFFFFF<\/color>\r\n<color name=\"background2\">#FFFFFFFF<\/color>\r\n<color name=\"textColor\">#FF000000<\/color>\r\n\r\n<color name=\"selectunit\">#2a54f4<\/color>\r\n\r\n<color name=\"convertUnit\">#1ac831<\/color>\r\n<\/resources><\/pre>\n
Now Go to res -> layout -> themes.xml and select NoActionBar<\/p>\n
![\"themes](\"https:\/\/techvidvan.com\/tutorials\/wp-content\/uploads\/sites\/2\/2022\/02\/themes-xml-image.webp\")
<\/a><\/p>\n<resources xmlns:tools=\"http:\/\/schemas.android.com\/tools\">\r\n<!-- Base application theme. -->\r\n<style name=\"Theme.UnitConverter\" parent=\"Theme.MaterialComponents.DayNight.NoActionBar\">\r\n<!-- Primary brand color. -->\r\n<item name=\"colorPrimary\">@color\/black<\/item>\r\n<item name=\"colorPrimaryVariant\">@color\/white<\/item>\r\n<item name=\"colorOnPrimary\">@color\/white<\/item>\r\n<!-- Secondary brand color. -->\r\n<item name=\"colorSecondary\">@color\/teal_200<\/item>\r\n<item name=\"colorSecondaryVariant\">@color\/teal_700<\/item>\r\n<item name=\"colorOnSecondary\">@color\/black<\/item>\r\n<!-- Status bar color. -->\r\n<item name=\"android:statusBarColor\" tools:targetApi=\"l\">?attr\/colorPrimaryVariant<\/item>\r\n<!-- Customize your theme here. -->\r\n<\/style>\r\n<\/resources><\/pre>\n
Go to res -> layout -> activity_splash_screen.xml, write the following code<\/p>\n
![\"splash](\"https:\/\/techvidvan.com\/tutorials\/wp-content\/uploads\/sites\/2\/2022\/02\/splash-screen-xml-code.webp\")
<\/a><\/p>\n<?xml version=\"1.0\" encoding=\"utf-8\"?>\r\n<LinearLayout xmlns:android=\"http:\/\/schemas.android.co\/apk\/res\/android\"\r\nxmlns:tools=\"http:\/\/schemas.android.com\/tools\"\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"match_parent\"\r\nandroid:background=\"@color\/background\"\r\nandroid:gravity=\"center\"\r\nandroid:orientation=\"vertical\"\r\ntools:context=\".SplashScreen\">\r\n<ImageView\r\nandroid:layout_width=\"200dp\"\r\nandroid:layout_height=\"200dp\"\r\nandroid:src=\"@drawable\/icon\" \/\r\n<TextView\r\nandroid:id=\"@+id\/tv_text\"\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_marginTop=\"40dp\"\r\nandroid:text=\"Unit Converter\\n by TechVidvan\"\r\nandroid:textAlignment=\"center\"\r\nandroid:textColor=\"@color\/textColor\"\r\nandroid:textSize=\"32sp\" \/>\r\n<\/LinearLayout><\/pre>\n
Go to SplashScreen.java file, paste the following code<\/p>\n
![\"splash](\"https:\/\/techvidvan.com\/tutorials\/wp-content\/uploads\/sites\/2\/2022\/02\/splash-screen-java-code.webp\")
<\/a><\/p>\npackage com.example.unitconverter;\r\nimport androidx.appcompat.app.AppCompatActivity;\r\n\r\nimport android.content.Intent;\r\nimport android.os.Bundle;\r\nimport android.os.Handler;\r\n\r\npublic class SplashScreen extends AppCompatActivity {\r\n\r\n@Override\r\nprotected void onCreate(Bundle savedInstanceState) {\r\nsuper.onCreate(savedInstanceState);\r\nsetContentView(R.layout.activity_splash_screen);\r\n\r\nnew Handler().postDelayed(new Runnable() {\r\n@Override\r\npublic void run() {\r\nstartActivity(new Intent(SplashScreen.this, MainActivity.class));\r\n}\r\n},2000);\r\n}\r\n}<\/pre>\nImport all the necessary packages by alt+Enter.<\/p>\n
Go to Manifest file and cut the intent-filter from the main activity and paste it inside SplashScreen. In the same file, in android icon -> change the line to @drawable\/logo and in round icon also -> @drawable\/logo<\/p>\n
![\"android](\"https:\/\/techvidvan.com\/tutorials\/wp-content\/uploads\/sites\/2\/2022\/02\/android-manifest-file.webp\")
<\/a><\/p>\n2. Add the icon images to drawable folder, these images are shipped with source code of Unit Converter Android App.\u00a0These are the 18 images that we will be using in our whole application.<\/p>\n
3. Write the following code to activity_main.xml file -><\/p>\n
<?xml version=\"1.0\" encoding=\"utf-8\"?>\r\n<androidx.core.widget.NestedScrollView xmlns:android=\"http:\/\/schemas.android.com\/apk\/res\/android\"\r\nxmlns:app=\"http:\/\/schemas.android.com\/apk\/res-auto\"\r\nxmlns:tools=\"http:\/\/schemas.android.com\/tools\"\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"match_parent\"\r\nandroid:background=\"@color\/background\">\r\n\r\n<RelativeLayout\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"match_parent\"\r\ntools:context=\".MainActivity\">\r\n\r\n<TextView\r\nandroid:id=\"@+id\/tv_text\"\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_marginLeft=\"30dp\"\r\nandroid:layout_marginTop=\"40dp\"\r\nandroid:layout_marginBottom=\"20dp\"\r\nandroid:text=\"Unit Converter\"\r\nandroid:textColor=\"@color\/textColor\"\r\nandroid:textSize=\"32sp\" \/>\r\n\r\n<TextView\r\nandroid:id=\"@+id\/tv_text2\"\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_below=\"@id\/tv_text\"\r\nandroid:layout_marginLeft=\"30dp\"\r\nandroid:layout_marginBottom=\"20dp\"\r\nandroid:text=\"By TechVidvan\"\r\nandroid:textColor=\"@color\/textColor\"\r\nandroid:textSize=\"28sp\" \/>\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_below=\"@id\/tv_text2\"\r\nandroid:layout_centerInParent=\"true\"\r\nandroid:layout_centerVertical=\"true\"\r\nandroid:layout_marginTop=\"20dp\"\r\nandroid:gravity=\"center\"\r\nandroid:orientation=\"vertical\">\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:gravity=\"center\"\r\nandroid:orientation=\"horizontal\"\r\nandroid:paddingTop=\"20dp\"\r\nandroid:paddingBottom=\"10dp\"\r\nandroid:weightSum=\"3\">\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"0dp\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_weight=\"1\"\r\nandroid:gravity=\"center\">\r\n\r\n<androidx.cardview.widget.CardView\r\nandroid:id=\"@+id\/cv_tmp\"\r\nandroid:layout_width=\"100dp\"\r\nandroid:layout_height=\"100dp\"\r\napp:cardCornerRadius=\"16dp\">\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"match_parent\"\r\nandroid:background=\"@color\/grey\"\r\nandroid:gravity=\"center\"\r\nandroid:orientation=\"vertical\">\r\n\r\n<ImageView\r\nandroid:id=\"@+id\/iv_tmp\"\r\nandroid:layout_width=\"30dp\"\r\nandroid:layout_height=\"30dp\"\r\nandroid:src=\"@drawable\/temperature\" \/>\r\n\r\n<TextView\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_marginTop=\"8dp\"\r\nandroid:text=\"Temperature\"\r\nandroid:textColor=\"@color\/textColor\"\r\nandroid:textSize=\"16sp\" \/>\r\n\r\n<\/LinearLayout>\r\n\r\n<\/androidx.cardview.widget.CardView>\r\n\r\n<\/LinearLayout>\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"0dp\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_weight=\"1\"\r\nandroid:gravity=\"center\">\r\n\r\n<androidx.cardview.widget.CardView\r\nandroid:id=\"@+id\/cv_weight\"\r\nandroid:layout_width=\"100dp\"\r\nandroid:layout_height=\"100dp\"\r\napp:cardCornerRadius=\"16dp\">\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"match_parent\"\r\nandroid:background=\"@color\/grey\"\r\nandroid:gravity=\"center\"\r\nandroid:orientation=\"vertical\">\r\n\r\n<ImageView\r\nandroid:id=\"@+id\/iv_weight\"\r\nandroid:layout_width=\"30dp\"\r\nandroid:layout_height=\"30dp\"\r\nandroid:src=\"@drawable\/weight\" \/>\r\n\r\n<TextView\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_marginTop=\"8dp\"\r\nandroid:text=\"Weight\"\r\nandroid:textColor=\"@color\/textColor\"\r\nandroid:textSize=\"16sp\"\r\nandroid:textStyle=\"bold\" \/>\r\n\r\n<\/LinearLayout>\r\n\r\n<\/androidx.cardview.widget.CardView>\r\n\r\n<\/LinearLayout>\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"0dp\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_weight=\"1\"\r\nandroid:gravity=\"center\">\r\n\r\n<androidx.cardview.widget.CardView\r\nandroid:id=\"@+id\/cv_length\"\r\nandroid:layout_width=\"100dp\"\r\nandroid:layout_height=\"100dp\"\r\napp:cardCornerRadius=\"16dp\">\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"match_parent\"\r\nandroid:background=\"@color\/grey\"\r\nandroid:gravity=\"center\"\r\nandroid:orientation=\"vertical\">\r\n\r\n<ImageView\r\nandroid:id=\"@+id\/iv_length\"\r\nandroid:layout_width=\"30dp\"\r\nandroid:layout_height=\"30dp\"\r\nandroid:src=\"@drawable\/length\" \/>\r\n\r\n<TextView\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_marginTop=\"8dp\"\r\nandroid:text=\"Length\"\r\nandroid:textColor=\"@color\/textColor\"\r\nandroid:textSize=\"16sp\"\r\nandroid:textStyle=\"bold\" \/>\r\n\r\n<\/LinearLayout>\r\n\r\n<\/androidx.cardview.widget.CardView>\r\n\r\n<\/LinearLayout>\r\n\r\n\r\n<\/LinearLayout>\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:gravity=\"center\"\r\nandroid:orientation=\"horizontal\"\r\nandroid:paddingTop=\"20dp\"\r\nandroid:paddingBottom=\"10dp\"\r\nandroid:weightSum=\"3\">\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"0dp\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_weight=\"1\"\r\nandroid:gravity=\"center\">\r\n\r\n<androidx.cardview.widget.CardView\r\nandroid:id=\"@+id\/cv_speed\"\r\nandroid:layout_width=\"100dp\"\r\nandroid:layout_height=\"100dp\"\r\napp:cardCornerRadius=\"16dp\">\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"match_parent\"\r\nandroid:background=\"@color\/grey\"\r\nandroid:gravity=\"center\"\r\nandroid:orientation=\"vertical\">\r\n\r\n<ImageView\r\nandroid:id=\"@+id\/iv_speed\"\r\nandroid:layout_width=\"30dp\"\r\nandroid:layout_height=\"30dp\"\r\nandroid:src=\"@drawable\/speed\" \/>\r\n\r\n<TextView\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_marginTop=\"8dp\"\r\nandroid:text=\"Speed\"\r\nandroid:textColor=\"@color\/textColor\"\r\nandroid:textSize=\"16sp\"\r\nandroid:textStyle=\"bold\" \/>\r\n\r\n<\/LinearLayout>\r\n\r\n<\/androidx.cardview.widget.CardView>\r\n\r\n<\/LinearLayout>\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"0dp\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_weight=\"1\"\r\nandroid:gravity=\"center\">\r\n\r\n<androidx.cardview.widget.CardView\r\nandroid:id=\"@+id\/cv_frequency\"\r\nandroid:layout_width=\"100dp\"\r\nandroid:layout_height=\"100dp\"\r\napp:cardCornerRadius=\"16dp\">\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"match_parent\"\r\nandroid:background=\"@color\/grey\"\r\nandroid:gravity=\"center\"\r\nandroid:orientation=\"vertical\">\r\n\r\n<ImageView\r\nandroid:id=\"@+id\/iv_frequency\"\r\nandroid:layout_width=\"30dp\"\r\nandroid:layout_height=\"30dp\"\r\nandroid:src=\"@drawable\/frequency\" \/>\r\n\r\n<TextView\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_marginTop=\"8dp\"\r\nandroid:text=\"Frequency\"\r\nandroid:textColor=\"@color\/textColor\"\r\nandroid:textSize=\"16sp\"\r\nandroid:textStyle=\"bold\" \/>\r\n\r\n<\/LinearLayout>\r\n\r\n<\/androidx.cardview.widget.CardView>\r\n\r\n<\/LinearLayout>\r\n\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"0dp\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_weight=\"1\"\r\nandroid:gravity=\"center\">\r\n\r\n<androidx.cardview.widget.CardView\r\nandroid:id=\"@+id\/cv_Volume\"\r\nandroid:layout_width=\"100dp\"\r\nandroid:layout_height=\"100dp\"\r\napp:cardCornerRadius=\"16dp\">\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"match_parent\"\r\nandroid:background=\"@color\/grey\"\r\nandroid:gravity=\"center\"\r\nandroid:orientation=\"vertical\">\r\n\r\n<ImageView\r\nandroid:id=\"@+id\/iv_volume\"\r\nandroid:layout_width=\"30dp\"\r\nandroid:layout_height=\"30dp\"\r\nandroid:src=\"@drawable\/volume\" \/>\r\n\r\n<TextView\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_marginTop=\"8dp\"\r\nandroid:text=\"Volume\"\r\nandroid:textColor=\"@color\/textColor\"\r\nandroid:textSize=\"16sp\"\r\nandroid:textStyle=\"bold\" \/>\r\n\r\n<\/LinearLayout>\r\n\r\n<\/androidx.cardview.widget.CardView>\r\n\r\n<\/LinearLayout>\r\n<\/LinearLayout>\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:gravity=\"center\"\r\nandroid:orientation=\"horizontal\"\r\nandroid:paddingTop=\"20dp\"\r\nandroid:paddingBottom=\"10dp\"\r\nandroid:weightSum=\"3\">\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"0dp\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_weight=\"1\"\r\nandroid:gravity=\"center\">\r\n\r\n<androidx.cardview.widget.CardView\r\nandroid:id=\"@+id\/cv_time\"\r\nandroid:layout_width=\"100dp\"\r\nandroid:layout_height=\"100dp\"\r\napp:cardCornerRadius=\"16dp\">\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"match_parent\"\r\nandroid:background=\"@color\/grey\"\r\nandroid:gravity=\"center\"\r\nandroid:orientation=\"vertical\">\r\n\r\n<ImageView\r\nandroid:id=\"@+id\/iv_time\"\r\nandroid:layout_width=\"30dp\"\r\nandroid:layout_height=\"30dp\"\r\nandroid:src=\"@drawable\/time\" \/>\r\n\r\n<TextView\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_marginTop=\"8dp\"\r\nandroid:text=\"Time\"\r\nandroid:textColor=\"@color\/textColor\"\r\nandroid:textSize=\"16sp\"\r\nandroid:textStyle=\"bold\" \/>\r\n\r\n<\/LinearLayout>\r\n\r\n<\/androidx.cardview.widget.CardView>\r\n\r\n<\/LinearLayout>\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"0dp\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_weight=\"1\"\r\nandroid:gravity=\"center\">\r\n\r\n<androidx.cardview.widget.CardView\r\nandroid:id=\"@+id\/cv_area\"\r\nandroid:layout_width=\"100dp\"\r\nandroid:layout_height=\"100dp\"\r\napp:cardCornerRadius=\"16dp\">\r\n\r\n<LinearLayout\r\n\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"match_parent\"\r\nandroid:background=\"@color\/grey\"\r\nandroid:gravity=\"center\"\r\nandroid:orientation=\"vertical\">\r\n\r\n<ImageView\r\nandroid:id=\"@+id\/iv_length\"\r\nandroid:layout_width=\"30dp\"\r\nandroid:layout_height=\"30dp\"\r\nandroid:src=\"@drawable\/length\" \/>\r\n\r\n<TextView\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_marginTop=\"8dp\"\r\nandroid:text=\"Length\"\r\nandroid:textColor=\"@color\/textColor\"\r\nandroid:textSize=\"16sp\"\r\nandroid:textStyle=\"bold\" \/>\r\n\r\n<\/LinearLayout>\r\n\r\n<\/androidx.cardview.widget.CardView>\r\n\r\n<\/LinearLayout>\r\n\r\n\r\n<\/LinearLayout>\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:gravity=\"center\"\r\nandroid:orientation=\"horizontal\"\r\nandroid:paddingTop=\"20dp\"\r\nandroid:paddingBottom=\"10dp\"\r\nandroid:weightSum=\"3\">\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"0dp\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_weight=\"1\"\r\nandroid:gravity=\"center\">\r\n\r\n<androidx.cardview.widget.CardView\r\nandroid:id=\"@+id\/cv_speed\"\r\nandroid:layout_width=\"100dp\"\r\nandroid:layout_height=\"100dp\"\r\napp:cardCornerRadius=\"16dp\">\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"match_parent\"\r\nandroid:background=\"@color\/grey\"\r\nandroid:gravity=\"center\"\r\nandroid:orientation=\"vertical\">\r\n\r\n<ImageView\r\nandroid:id=\"@+id\/iv_speed\"\r\nandroid:layout_width=\"30dp\"\r\nandroid:layout_height=\"30dp\"\r\nandroid:src=\"@drawable\/speed\" \/>\r\n\r\n<TextView\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_marginTop=\"8dp\"\r\nandroid:text=\"Speed\"\r\nandroid:textColor=\"@color\/textColor\"\r\nandroid:textSize=\"16sp\"\r\nandroid:textStyle=\"bold\" \/>\r\n\r\n<\/LinearLayout>\r\n\r\n<\/androidx.cardview.widget.CardView>\r\n\r\n<\/LinearLayout>\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"0dp\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_weight=\"1\"\r\nandroid:gravity=\"center\">\r\n\r\n<androidx.cardview.widget.CardView\r\nandroid:id=\"@+id\/cv_frequency\"\r\nandroid:layout_width=\"100dp\"\r\nandroid:layout_height=\"100dp\"\r\napp:cardCornerRadius=\"16dp\">\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"match_parent\"\r\nandroid:background=\"@color\/grey\"\r\nandroid:gravity=\"center\"\r\nandroid:orientation=\"vertical\">\r\n\r\n<ImageView\r\nandroid:id=\"@+id\/iv_frequency\"\r\nandroid:layout_width=\"30dp\"\r\nandroid:layout_height=\"30dp\"\r\nandroid:src=\"@drawable\/frequency\" \/>\r\n\r\n<TextView\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_marginTop=\"8dp\"\r\nandroid:text=\"Frequency\"\r\nandroid:textColor=\"@color\/textColor\"\r\nandroid:textSize=\"16sp\"\r\nandroid:textStyle=\"bold\" \/>\r\n\r\n<\/LinearLayout>\r\n\r\n<\/androidx.cardview.widget.CardView>\r\n\r\n<\/LinearLayout>\r\n\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"0dp\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_weight=\"1\"\r\nandroid:gravity=\"center\">\r\n\r\n<androidx.cardview.widget.CardView\r\nandroid:id=\"@+id\/cv_Volume\"\r\nandroid:layout_width=\"100dp\"\r\nandroid:layout_height=\"100dp\"\r\napp:cardCornerRadius=\"16dp\">\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"match_parent\"\r\nandroid:background=\"@color\/grey\"\r\nandroid:gravity=\"center\"\r\nandroid:orientation=\"vertical\">\r\n\r\n<ImageView\r\nandroid:id=\"@+id\/iv_volume\"\r\nandroid:layout_width=\"30dp\"\r\nandroid:layout_height=\"30dp\"\r\nandroid:src=\"@drawable\/volume\" \/>\r\n\r\n<TextView\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_marginTop=\"8dp\"\r\nandroid:text=\"Volume\"\r\nandroid:textColor=\"@color\/textColor\"\r\nandroid:textSize=\"16sp\"\r\nandroid:textStyle=\"bold\" \/>\r\n\r\n<\/LinearLayout>\r\n\r\n<\/androidx.cardview.widget.CardView>\r\n\r\n<\/LinearLayout>\r\n<\/LinearLayout>\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:gravity=\"center\"\r\nandroid:orientation=\"horizontal\"\r\nandroid:paddingTop=\"20dp\"\r\nandroid:paddingBottom=\"10dp\"\r\nandroid:weightSum=\"3\">\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"0dp\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_weight=\"1\"\r\nandroid:gravity=\"center\">\r\n\r\n<androidx.cardview.widget.CardView\r\nandroid:id=\"@+id\/cv_time\"\r\nandroid:layout_width=\"100dp\"\r\nandroid:layout_height=\"100dp\"\r\napp:cardCornerRadius=\"16dp\">\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"match_parent\"\r\nandroid:background=\"@color\/grey\"\r\nandroid:gravity=\"center\"\r\nandroid:orientation=\"vertical\">\r\n\r\n<ImageView\r\nandroid:id=\"@+id\/iv_time\"\r\nandroid:layout_width=\"30dp\"\r\nandroid:layout_height=\"30dp\"\r\nandroid:src=\"@drawable\/time\" \/>\r\n\r\n<TextView\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_marginTop=\"8dp\"\r\nandroid:text=\"Time\"\r\nandroid:textColor=\"@color\/textColor\"\r\nandroid:textSize=\"16sp\"\r\nandroid:textStyle=\"bold\" \/>\r\n\r\n<\/LinearLayout>\r\n\r\n<\/androidx.cardview.widget.CardView>\r\n\r\n<\/LinearLayout>\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"0dp\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_weight=\"1\"\r\nandroid:gravity=\"center\">\r\n\r\n<androidx.cardview.widget.CardView\r\nandroid:id=\"@+id\/cv_area\"\r\nandroid:layout_width=\"100dp\"\r\nandroid:layout_height=\"100dp\"\r\napp:cardCornerRadius=\"16dp\">\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"match_parent\"\r\nandroid:background=\"@color\/grey\"\r\nandroid:gravity=\"center\"\r\nandroid:orientation=\"vertical\">\r\n\r\n<ImageView\r\nandroid:id=\"@+id\/iv_area\"\r\nandroid:layout_width=\"30dp\"\r\nandroid:layout_height=\"30dp\"\r\nandroid:src=\"@drawable\/area\" \/>\r\n\r\n<TextView\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_marginTop=\"8dp\"\r\nandroid:text=\"Area\"\r\nandroid:textColor=\"@color\/textColor\"\r\nandroid:textSize=\"16sp\"\r\nandroid:textStyle=\"bold\" \/>\r\n\r\n<\/LinearLayout>\r\n\r\n<\/androidx.cardview.widget.CardView>\r\n\r\n<\/LinearLayout>\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"0dp\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_weight=\"1\"\r\nandroid:gravity=\"center\">\r\n\r\n<androidx.cardview.widget.CardView\r\nandroid:id=\"@+id\/cv_fuel\"\r\nandroid:layout_width=\"100dp\"\r\nandroid:layout_height=\"100dp\"\r\napp:cardCornerRadius=\"16dp\">\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"match_parent\"\r\nandroid:background=\"@color\/grey\"\r\nandroid:gravity=\"center\"\r\nandroid:orientation=\"vertical\">\r\n\r\n<ImageView\r\nandroid:id=\"@+id\/iv_fuel\"\r\nandroid:layout_width=\"30dp\"\r\nandroid:layout_height=\"30dp\"\r\nandroid:src=\"@drawable\/fuel\" \/>\r\n\r\n<TextView\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_marginTop=\"8dp\"\r\nandroid:text=\"Fuel\"\r\nandroid:textColor=\"@color\/textColor\"\r\nandroid:textSize=\"16sp\"\r\nandroid:textStyle=\"bold\" \/>\r\n\r\n<\/LinearLayout>\r\n\r\n<\/androidx.cardview.widget.CardView>\r\n\r\n<\/LinearLayout>\r\n<\/LinearLayout>\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:gravity=\"center\"\r\nandroid:orientation=\"horizontal\"\r\nandroid:paddingTop=\"20dp\"\r\nandroid:paddingBottom=\"10dp\"\r\nandroid:weightSum=\"3\">\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"0dp\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_weight=\"1\"\r\nandroid:gravity=\"center\">\r\n\r\n<androidx.cardview.widget.CardView\r\nandroid:id=\"@+id\/cv_pressure\"\r\nandroid:layout_width=\"100dp\"\r\nandroid:layout_height=\"100dp\"\r\napp:cardCornerRadius=\"16dp\">\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"match_parent\"\r\nandroid:background=\"@color\/grey\"\r\nandroid:gravity=\"center\"\r\nandroid:orientation=\"vertical\">\r\n\r\n<ImageView\r\nandroid:id=\"@+id\/iv_pressure\"\r\nandroid:layout_width=\"30dp\"\r\nandroid:layout_height=\"30dp\"\r\nandroid:src=\"@drawable\/pressure\" \/>\r\n\r\n<TextView\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_marginTop=\"8dp\"\r\nandroid:text=\"Pressure\"\r\nandroid:textColor=\"@color\/textColor\"\r\nandroid:textSize=\"16sp\"\r\nandroid:textStyle=\"bold\" \/>\r\n\r\n<\/LinearLayout>\r\n\r\n<\/androidx.cardview.widget.CardView>\r\n\r\n<\/LinearLayout>\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"0dp\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_weight=\"1\"\r\nandroid:gravity=\"center\">\r\n\r\n<androidx.cardview.widget.CardView\r\nandroid:id=\"@+id\/cv_energy\"\r\nandroid:layout_width=\"100dp\"\r\nandroid:layout_height=\"100dp\"\r\napp:cardCornerRadius=\"16dp\">\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"match_parent\"\r\nandroid:background=\"@color\/grey\"\r\nandroid:gravity=\"center\"\r\nandroid:orientation=\"vertical\">\r\n\r\n<ImageView\r\nandroid:id=\"@+id\/iv_energy\"\r\nandroid:layout_width=\"30dp\"\r\nandroid:layout_height=\"30dp\"\r\nandroid:src=\"@drawable\/energy\" \/>\r\n\r\n<TextView\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_marginTop=\"8dp\"\r\nandroid:text=\"Energy\"\r\nandroid:textColor=\"@color\/textColor\"\r\nandroid:textSize=\"16sp\"\r\nandroid:textStyle=\"bold\" \/>\r\n\r\n<\/LinearLayout>\r\n\r\n<\/androidx.cardview.widget.CardView>\r\n\r\n<\/LinearLayout>\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"0dp\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_weight=\"1\"\r\nandroid:gravity=\"center\">\r\n\r\n<androidx.cardview.widget.CardView\r\nandroid:id=\"@+id\/cv_storage\"\r\nandroid:layout_width=\"100dp\"\r\nandroid:layout_height=\"100dp\"\r\napp:cardCornerRadius=\"16dp\">\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"match_parent\"\r\nandroid:background=\"@color\/grey\"\r\nandroid:gravity=\"center\"\r\nandroid:orientation=\"vertical\">\r\n\r\n<ImageView\r\nandroid:id=\"@+id\/iv_storage\"\r\nandroid:layout_width=\"30dp\"\r\nandroid:layout_height=\"30dp\"\r\nandroid:src=\"@drawable\/storage\" \/>\r\n\r\n<TextView\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_marginTop=\"8dp\"\r\nandroid:text=\"Storage\"\r\nandroid:textColor=\"@color\/textColor\"\r\nandroid:textSize=\"16sp\"\r\nandroid:textStyle=\"bold\" \/>\r\n\r\n<\/LinearLayout>\r\n\r\n<\/androidx.cardview.widget.CardView>\r\n\r\n<\/LinearLayout>\r\n<\/LinearLayout>\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:gravity=\"center\"\r\nandroid:orientation=\"horizontal\"\r\nandroid:paddingTop=\"20dp\"\r\nandroid:paddingBottom=\"10dp\"\r\nandroid:weightSum=\"3\">\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"0dp\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_weight=\"1\"\r\nandroid:gravity=\"center\">\r\n\r\n<androidx.cardview.widget.CardView\r\nandroid:id=\"@+id\/cv_current\"\r\nandroid:layout_width=\"100dp\"\r\nandroid:layout_height=\"100dp\"\r\napp:cardCornerRadius=\"16dp\">\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"match_parent\"\r\nandroid:background=\"@color\/grey\"\r\nandroid:gravity=\"center\"\r\nandroid:orientation=\"vertical\">\r\n\r\n<ImageView\r\nandroid:id=\"@+id\/iv_current\"\r\nandroid:layout_width=\"30dp\"\r\nandroid:layout_height=\"30dp\"\r\nandroid:src=\"@drawable\/current\" \/>\r\n\r\n<TextView\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_marginTop=\"8dp\"\r\nandroid:text=\"Current\"\r\nandroid:textColor=\"@color\/textColor\"\r\nandroid:textSize=\"16sp\"\r\nandroid:textStyle=\"bold\" \/>\r\n\r\n<\/LinearLayout>\r\n\r\n<\/androidx.cardview.widget.CardView>\r\n\r\n<\/LinearLayout>\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"0dp\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_weight=\"1\"\r\nandroid:gravity=\"center\">\r\n\r\n<androidx.cardview.widget.CardView\r\nandroid:id=\"@+id\/cv_force\"\r\nandroid:layout_width=\"100dp\"\r\nandroid:layout_height=\"100dp\"\r\napp:cardCornerRadius=\"16dp\">\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"match_parent\"\r\nandroid:background=\"@color\/grey\"\r\nandroid:gravity=\"center\"\r\nandroid:orientation=\"vertical\">\r\n\r\n<ImageView\r\nandroid:id=\"@+id\/iv_force\"\r\nandroid:layout_width=\"30dp\"\r\nandroid:layout_height=\"30dp\"\r\nandroid:src=\"@drawable\/force\" \/>\r\n\r\n<TextView\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_marginTop=\"8dp\"\r\nandroid:text=\"Force\"\r\nandroid:textColor=\"@color\/textColor\"\r\nandroid:textSize=\"16sp\"\r\nandroid:textStyle=\"bold\" \/>\r\n\r\n<\/LinearLayout>\r\n\r\n<\/androidx.cardview.widget.CardView>\r\n\r\n<\/LinearLayout>\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"0dp\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_weight=\"1\"\r\nandroid:gravity=\"center\">\r\n\r\n<androidx.cardview.widget.CardView\r\nandroid:id=\"@+id\/cv_resistence\"\r\nandroid:layout_width=\"100dp\"\r\nandroid:layout_height=\"100dp\"\r\napp:cardCornerRadius=\"16dp\">\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"match_parent\"\r\nandroid:background=\"@color\/grey\"\r\nandroid:gravity=\"center\"\r\nandroid:orientation=\"vertical\">\r\n\r\n<ImageView\r\nandroid:id=\"@+id\/iv_resistence\"\r\nandroid:layout_width=\"30dp\"\r\nandroid:layout_height=\"30dp\"\r\nandroid:src=\"@drawable\/resistance\" \/>\r\n\r\n<TextView\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_marginTop=\"8dp\"\r\nandroid:text=\"Resistence\"\r\nandroid:textColor=\"@color\/textColor\"\r\nandroid:textSize=\"16sp\"\r\nandroid:textStyle=\"bold\" \/>\r\n\r\n<\/LinearLayout>\r\n\r\n<\/androidx.cardview.widget.CardView>\r\n\r\n<\/LinearLayout>\r\n\r\n<\/LinearLayout>\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:orientation=\"horizontal\"\r\nandroid:weightSum=\"3\">\r\n\r\n<\/LinearLayout>\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:gravity=\"center\"\r\nandroid:orientation=\"horizontal\"\r\nandroid:paddingTop=\"20dp\"\r\nandroid:paddingBottom=\"10dp\"\r\nandroid:weightSum=\"3\">\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"0dp\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_weight=\"1\"\r\nandroid:gravity=\"center\">\r\n\r\n<androidx.cardview.widget.CardView\r\nandroid:id=\"@+id\/cv_power\"\r\nandroid:layout_width=\"100dp\"\r\nandroid:layout_height=\"100dp\"\r\napp:cardCornerRadius=\"16dp\">\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"match_parent\"\r\nandroid:background=\"@color\/grey\"\r\nandroid:gravity=\"center\"\r\nandroid:orientation=\"vertical\">\r\n\r\n<ImageView\r\nandroid:id=\"@+id\/iv_power\"\r\nandroid:layout_width=\"30dp\"\r\nandroid:layout_height=\"30dp\"\r\nandroid:src=\"@drawable\/power\" \/>\r\n\r\n<TextView\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_marginTop=\"8dp\"\r\nandroid:text=\"Power\"\r\nandroid:textColor=\"@color\/textColor\"\r\nandroid:textSize=\"16sp\"\r\nandroid:textStyle=\"bold\" \/>\r\n\r\n<\/LinearLayout>\r\n\r\n<\/androidx.cardview.widget.CardView>\r\n\r\n<\/LinearLayout>\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"0dp\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_weight=\"1\"\r\nandroid:gravity=\"center\">\r\n\r\n<androidx.cardview.widget.CardView\r\nandroid:id=\"@+id\/cv_torque\"\r\nandroid:layout_width=\"100dp\"\r\nandroid:layout_height=\"100dp\"\r\napp:cardCornerRadius=\"16dp\">\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"match_parent\"\r\nandroid:background=\"@color\/grey\"\r\nandroid:gravity=\"center\"\r\nandroid:orientation=\"vertical\">\r\n\r\n<ImageView\r\nandroid:id=\"@+id\/iv_torque\"\r\nandroid:layout_width=\"30dp\"\r\nandroid:layout_height=\"30dp\"\r\nandroid:src=\"@drawable\/torque\" \/>\r\n\r\n<TextView\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_marginTop=\"8dp\"\r\nandroid:text=\"Torque\"\r\nandroid:textColor=\"@color\/textColor\"\r\nandroid:textSize=\"16sp\"\r\nandroid:textStyle=\"bold\" \/>\r\n\r\n<\/LinearLayout>\r\n\r\n<\/androidx.cardview.widget.CardView>\r\n\r\n<\/LinearLayout>\r\n\r\n<\/LinearLayout>\r\n\r\n<\/LinearLayout>\r\n\r\n<\/RelativeLayout>\r\n\r\n\r\n<\/androidx.core.widget.NestedScrollView><\/pre>\n
This is the design code for the main screen. This is using nested Scrollview for scrolling and some nested linear layouts and relative layouts and CardView -> clicking on which will take you to its particular screen.<\/p>\n
Your screen will look like this.<\/p>\n
<\/a><\/p>\n5. Add the following code to MainActivity.java<\/p>\n
package com.example.unitconverter;\r\n\r\nimport android.content.Intent;\r\nimport android.os.Bundle;\r\nimport android.view.View;\r\n\r\nimport androidx.appcompat.app.AppCompatActivity;\r\nimport androidx.cardview.widget.CardView;\r\n\r\npublic class MainActivity extends AppCompatActivity {\r\n\r\nCardView cv_tmp;\r\nCardView cv_weight;\r\nCardView cv_length;\r\nCardView cv_speed;\r\nCardView cv_volume;\r\nCardView cv_time;\r\nCardView cv_area;\r\nCardView cv_fuel;\r\nCardView cv_pressure;\r\nCardView cv_energy;\r\nCardView cv_storage;\r\nCardView cv_current;\r\nCardView cv_force;\r\nCardView cv_freq;\r\nCardView cv_resistance;\r\nCardView cv_power;\r\nCardView cv_torque;\r\n\r\n@Override\r\nprotected void onCreate(Bundle savedInstanceState) {\r\nsuper.onCreate(savedInstanceState);\r\nsetContentView(R.layout.activity_main);\r\n\r\ncv_tmp = findViewById(R.id.cv_tmp);\r\ncv_weight = findViewById(R.id.cv_weight);\r\ncv_length = findViewById(R.id.cv_length);\r\ncv_speed = findViewById(R.id.cv_speed);\r\ncv_volume = findViewById(R.id.cv_Volume);\r\ncv_time = findViewById(R.id.cv_time);\r\ncv_area = findViewById(R.id.cv_area);\r\ncv_fuel = findViewById(R.id.cv_fuel);\r\ncv_pressure = findViewById(R.id.cv_pressure);\r\ncv_energy = findViewById(R.id.cv_energy);\r\ncv_storage = findViewById(R.id.cv_storage);\r\ncv_current = findViewById(R.id.cv_current);\r\ncv_force = findViewById(R.id.cv_force);\r\ncv_freq = findViewById(R.id.cv_frequency);\r\ncv_resistance = findViewById(R.id.cv_resistence);\r\ncv_power = findViewById(R.id.cv_power);\r\ncv_torque = findViewById(R.id.cv_torque);\r\n\r\ncv_tmp.setOnClickListener(new View.OnClickListener() {\r\n@Override\r\npublic void onClick(View v) {\r\nstartActivity(new Intent(MainActivity.this, temp_cal.class));\r\n}\r\n});\r\ncv_weight.setOnClickListener(new View.OnClickListener() {\r\n@Override\r\npublic void onClick(View v) {\r\nstartActivity(new Intent(MainActivity.this, weight_cal.class));\r\n}\r\n});\r\ncv_length.setOnClickListener(new View.OnClickListener() {\r\n@Override\r\npublic void onClick(View v) {\r\nstartActivity(new Intent(MainActivity.this, length_cal.class));\r\n}\r\n});\r\ncv_speed.setOnClickListener(new View.OnClickListener() {\r\n@Override\r\npublic void onClick(View v) {\r\nstartActivity(new Intent(MainActivity.this, speed_cal.class));\r\n}\r\n});\r\ncv_volume.setOnClickListener(new View.OnClickListener() {\r\n@Override\r\npublic void onClick(View v) {\r\nstartActivity(new Intent(MainActivity.this, volume_cal.class));\r\n}\r\n});\r\ncv_time.setOnClickListener(new View.OnClickListener() {\r\n@Override\r\npublic void onClick(View v) {\r\nstartActivity(new Intent(MainActivity.this, time_cal.class));\r\n}\r\n});\r\ncv_area.setOnClickListener(new View.OnClickListener() {\r\n@Override\r\npublic void onClick(View v) {\r\nstartActivity(new Intent(MainActivity.this, area_cal.class));\r\n}\r\n});\r\ncv_fuel.setOnClickListener(new View.OnClickListener() {\r\n@Override\r\npublic void onClick(View v) {\r\nstartActivity(new Intent(MainActivity.this, fuel_cal.class));\r\n}\r\n});\r\ncv_pressure.setOnClickListener(new View.OnClickListener() {\r\n@Override\r\npublic void onClick(View v) {\r\nstartActivity(new Intent(MainActivity.this, pressure_cal.class));\r\n}\r\n});\r\ncv_energy.setOnClickListener(new View.OnClickListener() {\r\n@Override\r\npublic void onClick(View v) {\r\nstartActivity(new Intent(MainActivity.this, energy_cal.class));\r\n}\r\n});\r\ncv_storage.setOnClickListener(new View.OnClickListener() {\r\n@Override\r\npublic void onClick(View v) {\r\nstartActivity(new Intent(MainActivity.this, storage_cal.class));\r\n}\r\n});\r\ncv_current.setOnClickListener(new View.OnClickListener() {\r\n@Override\r\npublic void onClick(View v) {\r\nstartActivity(new Intent(MainActivity.this, current_cal.class));\r\n}\r\n});\r\ncv_force.setOnClickListener(new View.OnClickListener() {\r\n@Override\r\npublic void onClick(View v) {\r\nstartActivity(new Intent(MainActivity.this, force_cal.class));\r\n}\r\n});\r\ncv_freq.setOnClickListener(new View.OnClickListener() {\r\n@Override\r\npublic void onClick(View v) {\r\nstartActivity(new Intent(MainActivity.this, freq_cal.class));\r\n}\r\n});\r\ncv_resistance.setOnClickListener(new View.OnClickListener() {\r\n@Override\r\npublic void onClick(View v) {\r\nstartActivity(new Intent(MainActivity.this, resistance_cal.class));\r\n}\r\n});\r\ncv_power.setOnClickListener(new View.OnClickListener() {\r\n@Override\r\npublic void onClick(View v) {\r\nstartActivity(new Intent(MainActivity.this, power_cal.class));\r\n}\r\n});\r\ncv_torque.setOnClickListener(new View.OnClickListener() {\r\n@Override\r\npublic void onClick(View v) {\r\nstartActivity(new Intent(MainActivity.this, torque_cal.class));\r\n}\r\n});\r\n\r\n}\r\n}\r\n<\/pre>\n6. This code basically redirects you to its screen when you click on it and it is using an intent for this.
\n7. Now let\u2019s create Activities that it will redirect to when the user clicks on the for instance temperature.
\n8. Right click on source package -> new -> Activity -> Empty Activity -> name it \u201ctemp_cal\u201d -> click on finish
\n9. Go to activity_temp_cal.xml and add the following code to it -><\/p>\n<?xml version=\"1.0\" encoding=\"utf-8\"?>\r\n<RelativeLayout xmlns:android=\"http:\/\/schemas.android.com\/apk\/res\/android\"\r\nxmlns:app=\"http:\/\/schemas.android.com\/apk\/res-auto\"\r\nxmlns:tools=\"http:\/\/schemas.android.com\/tools\"\r\nandroid:id=\"@+id\/temp_relativeLayout\"\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"match_parent\"\r\nandroid:background=\"@color\/background\"\r\ntools:context=\".temp_cal\">\r\n\r\n<LinearLayout\r\nandroid:id=\"@+id\/ll_heading\"\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_marginBottom=\"20dp\"\r\nandroid:orientation=\"horizontal\">\r\n\r\n<TextView\r\nandroid:id=\"@+id\/tv_text\"\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_marginLeft=\"30dp\"\r\nandroid:layout_marginTop=\"40dp\"\r\nandroid:text=\"Temperature\"\r\nandroid:textColor=\"@color\/textColor\"\r\nandroid:textSize=\"24sp\" \/>\r\n\r\n<ImageView\r\nandroid:layout_width=\"40dp\"\r\nandroid:layout_height=\"40dp\"\r\nandroid:layout_marginLeft=\"8dp\"\r\nandroid:layout_marginTop=\"40dp\"\r\nandroid:src=\"@drawable\/temperature\" \/>\r\n\r\n<\/LinearLayout>\r\n\r\n<LinearLayout\r\nandroid:id=\"@+id\/editTextLinearLayout\"\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_below=\"@id\/ll_heading\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_marginTop=\"20dp\"\r\nandroid:orientation=\"horizontal\"\r\nandroid:weightSum=\"2\">\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"0dp\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_weight=\"1\"\r\nandroid:orientation=\"vertical\">\r\n\r\n<EditText\r\nandroid:id=\"@+id\/et_fromUnit\"\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_margin=\"8dp\"\r\nandroid:background=\"@drawable\/bg_rounded_input_field\"\r\nandroid:hint=\"From\"\r\nandroid:inputType=\"phone\"\r\nandroid:padding=\"12dp\"\r\nandroid:textColor=\"@color\/textColor\"\r\nandroid:textColorHint=\"@color\/hintColor\"\r\nandroid:textCursorDrawable=\"@null\" \/>\r\n\r\n<TextView\r\nandroid:id=\"@+id\/tv_fromUnit\"\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:text=\"Celcius\"\r\nandroid:textAlignment=\"center\"\r\nandroid:textColor=\"@color\/textColor\"\r\nandroid:textSize=\"16sp\" \/>\r\n\r\n<\/LinearLayout>\r\n\r\n<LinearLayout\r\nandroid:layout_width=\"0dp\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_weight=\"1\"\r\nandroid:orientation=\"vertical\">\r\n\r\n<EditText\r\nandroid:id=\"@+id\/et_toUnit\"\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_margin=\"8dp\"\r\nandroid:background=\"@drawable\/bg_rounded_input_field\"\r\nandroid:hint=\"To\"\r\nandroid:enabled=\"false\"\r\nandroid:inputType=\"none\"\r\nandroid:padding=\"12dp\"\r\nandroid:textColor=\"@color\/textColor\"\r\nandroid:textColorHint=\"@color\/hintColor\"\r\nandroid:textCursorDrawable=\"@null\" \/>\r\n\r\n<TextView\r\nandroid:id=\"@+id\/tv_toUnit\"\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:text=\"Fahrenheit\"\r\nandroid:textAlignment=\"center\"\r\nandroid:textColor=\"@color\/textColor\"\r\nandroid:textSize=\"16sp\" \/>\r\n\r\n<\/LinearLayout>\r\n\r\n<\/LinearLayout>\r\n\r\n<LinearLayout\r\nandroid:id=\"@+id\/listViewLinearLayout\"\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"wrap_content\"\r\n\r\n\r\nandroid:layout_below=\"@id\/editTextLinearLayout\"\r\nandroid:layout_marginTop=\"40dp\"\r\nandroid:orientation=\"horizontal\"\r\nandroid:weightSum=\"2\">\r\n\r\n<androidx.cardview.widget.CardView\r\nandroid:id=\"@+id\/fromUnit\"\r\nandroid:layout_width=\"0dp\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_marginLeft=\"24dp\"\r\nandroid:layout_marginTop=\"16dp\"\r\nandroid:layout_marginRight=\"24dp\"\r\nandroid:layout_marginBottom=\"12dp\"\r\nandroid:layout_weight=\"1\"\r\napp:cardCornerRadius=\"10dp\"\r\napp:cardElevation=\"10dp\">\r\n\r\n<RelativeLayout\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:background=\"@color\/selectunit\"\r\nandroid:padding=\"4dp\">\r\n\r\n<RelativeLayout\r\nandroid:id=\"@+id\/rl_fromUnit\"\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_centerInParent=\"true\"\r\nandroid:padding=\"8dp\">\r\n\r\n<TextView\r\nandroid:id=\"@+id\/tv2_fromUnit\"\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_marginRight=\"4dp\"\r\nandroid:text=\"Select Unit\"\r\nandroid:textColor=\"@color\/white\"\r\nandroid:textSize=\"20sp\" \/>\r\n\r\n<ImageView\r\nandroid:layout_width=\"20dp\"\r\nandroid:layout_height=\"20dp\"\r\nandroid:layout_centerVertical=\"true\"\r\nandroid:layout_marginLeft=\"4dp\"\r\nandroid:layout_toRightOf=\"@id\/tv2_fromUnit\"\r\nandroid:src=\"@drawable\/down_arrow\"\r\napp:tint=\"@color\/white\" \/>\r\n\r\n<\/RelativeLayout>\r\n\r\n<\/RelativeLayout>\r\n\r\n<\/androidx.cardview.widget.CardView>\r\n\r\n<androidx.cardview.widget.CardView\r\nandroid:id=\"@+id\/toUnit\"\r\nandroid:layout_width=\"0dp\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_marginLeft=\"24dp\"\r\nandroid:layout_marginTop=\"16dp\"\r\nandroid:layout_marginRight=\"24dp\"\r\nandroid:layout_marginBottom=\"12dp\"\r\nandroid:layout_weight=\"1\"\r\napp:cardCornerRadius=\"10dp\"\r\napp:cardElevation=\"10dp\">\r\n\r\n<RelativeLayout\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:background=\"@color\/selectunit\"\r\nandroid:padding=\"4dp\">\r\n\r\n<RelativeLayout\r\nandroid:id=\"@+id\/rl_selectToUnit\"\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_centerInParent=\"true\"\r\nandroid:padding=\"8dp\">\r\n\r\n<TextView\r\nandroid:id=\"@+id\/tv2_toUnit\"\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_marginRight=\"4dp\"\r\nandroid:text=\"Select Unit\"\r\nandroid:textColor=\"@color\/white\"\r\nandroid:textSize=\"20sp\" \/>\r\n\r\n<ImageView\r\nandroid:layout_width=\"20dp\"\r\nandroid:layout_height=\"20dp\"\r\nandroid:layout_centerVertical=\"true\"\r\nandroid:layout_marginLeft=\"4dp\"\r\nandroid:layout_toRightOf=\"@id\/tv2_toUnit\"\r\nandroid:src=\"@drawable\/down_arrow\"\r\napp:tint=\"@color\/white\" \/>\r\n\r\n<\/RelativeLayout>\r\n\r\n<\/RelativeLayout>\r\n\r\n<\/androidx.cardview.widget.CardView>\r\n\r\n<\/LinearLayout>\r\n\r\n<androidx.cardview.widget.CardView\r\nandroid:id=\"@+id\/cv_convert\"\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_below=\"@id\/listViewLinearLayout\"\r\nandroid:layout_centerHorizontal=\"true\"\r\nandroid:layout_marginLeft=\"24dp\"\r\nandroid:layout_marginTop=\"24dp\"\r\napp:cardCornerRadius=\"10dp\"\r\napp:cardElevation=\"10dp\">\r\n\r\n<RelativeLayout\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:background=\"@color\/convertUnit\"\r\nandroid:padding=\"8dp\">\r\n\r\n<RelativeLayout\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_centerInParent=\"true\"\r\nandroid:padding=\"8dp\">\r\n\r\n<TextView\r\nandroid:id=\"@+id\/btn_convert\"\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\n\r\n\r\nandroid:layout_marginRight=\"4dp\"\r\nandroid:text=\"Convert\"\r\nandroid:textColor=\"@color\/white\"\r\nandroid:textSize=\"20sp\" \/>\r\n\r\n<ImageView\r\nandroid:layout_width=\"30dp\"\r\nandroid:layout_height=\"30dp\"\r\nandroid:layout_marginLeft=\"8dp\"\r\nandroid:layout_toRightOf=\"@id\/btn_convert\"\r\nandroid:src=\"@drawable\/convert\"\/>\r\n\r\n<\/RelativeLayout>\r\n\r\n<\/RelativeLayout>\r\n\r\n<\/androidx.cardview.widget.CardView>\r\n\r\n\r\n<\/RelativeLayout><\/pre>\n
Your temp_cal.xml will look like this<\/p>\n
- colors.xml: This file has the colors described so it would be easy to mention the color name to recognize it.<\/li>\n<\/ol>\n<\/li>\n<\/ol>\n