Android App Development | Beginner Course | Lecture#19 | Hive Learners

[faisalamin]

𝓖𝓻𝓮𝓮𝓽𝓲𝓷𝓰𝓼

Hello dear Hive Learners, Welcome to the 19th lecture on Android App Development. In lecture 18 we use CardView to round the button to get a perfect rounded button. Before the lecture, I try the Material Design button to get a perfect round shape but I failed and that is why we learn the CardView role in design before the exact time. Today I successfully get the rounded Button by using a simple Material Design Button. With this button, we will also get a ripple effect on button clicks. With CardView we do not get the ripple effect. Today we will also write the logic for the new button that we had add-in lecture 18.

GitHub Link

Use this GitHub project to clone into your directory. It will constantly get updated in the following lecture so you will never miss the latest code. Happy Coding!.

What Should I Learn

• Get Rounded Material Design Button
• How to clear the screen.
• Use of CardView for TextViews

Assignment

• Design your calculator
• Write logic for Buttons

Procedure

We need to remove the Card View tag from all the XML code and change the simple Button tag to the Material Design Button tag.

We also need to change some attributes in the Button. Here is the code for the full rounded Button. We add cornerRadius, marginRight, background tint, and width of the Material Design Button. The line style="@style/Widget.AppCompat.Button" is very important to get the corner rounded.

        <com.google.android.material.button.MaterialButton
            android:id="@+id/num1_btn"
            style="@style/Widget.AppCompat.Button"
            android:layout_width="40dp"
            android:layout_height="wrap_content"
            android:layout_marginRight="5dp"
            android:backgroundTint="@color/black"
            android:text="1"
            android:textColor="@color/white"
            app:cornerRadius="20dp" />

Repeat the same steps for all the buttons.

Now we add the CardView for TextView. We apply the CardView on screen_1 and to screen_2 to make it more beautiful.

 <androidx.cardview.widget.CardView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            app:cardBackgroundColor="@color/white"
            app:cardCornerRadius="4dp"
            app:cardElevation="4dp"
            app:cardUseCompatPadding="true">

            <TextView
                android:id="@+id/screen1_tv"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:textAlignment="center"
                android:textColor="@color/black"
                android:textSize="24sp" />
        </androidx.cardview.widget.CardView>

        <androidx.cardview.widget.CardView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:cardBackgroundColor="@color/cardview_dark_background"
            app:cardCornerRadius="4dp"
            app:cardElevation="4dp"
            app:cardUseCompatPadding="true">

            <TextView
                android:id="@+id/screen2_tv"
                android:layout_width="40dp"
                android:layout_height="wrap_content"
                android:textAlignment="center"
                android:textColor="@color/white"
                android:textSize="24sp" />
        </androidx.cardview.widget.CardView>

Now we will write the logic for all the newly added buttons. I also change the coding for the equal button. Now it is supporting the Float. It means now we can add the floating number.

Implement the on-click listener for the del_btn

del_btn.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                screen1_tv.setText("");
                first_num = 0;
                screen2_tv.setText("");
            }
        });

Thank You

Comments

[eniolw]

Interesting. I will check out from the beginning.

BTW, your cover image has a misspelling. It says Andriod instead of Android. Unless I missed something, I'm surprised it's been 19 lectures with that already and you haven't noticed :)

[faisalamin]

OMG, That is really insane. I will never look into this If you haven't pointed out this spelling mistake Many thanks to you, I will fix it right now

[gwajnberg]

Almost done the calculator!!
!1UP

[curation-cartel]

	You have received a 1UP from @gwajnberg! The @oneup-cartel will soon upvote you with: @stem-curator And they will bring !PIZZA 🍕.

^{Learn more about our delegation service to earn daily rewards. Join the Cartel on Discord.}

[pizzabot]

PIZZA!

PIZZA Holders sent $PIZZA tips in this post's comments:
@curation-cartel_(6/20) tipped @faisalamin (x1)

_{Learn more at https://hive.pizza.}

[stemsocial]

Thanks for your contribution to the STEMsocial community. Feel free to join us on discord to get to know the rest of us!

Please consider delegating to the @stemsocial account (85% of the curation rewards are returned).

You may also include @stemsocial as a beneficiary of the rewards of this post to get a stronger support.