Improvements in bottom bar layout #235

ajay-prabhakar · 2019-04-02T15:47:44Z

Closes #174

What has been done to verify that this 4works as intended?

Tested in Android Studio and my phone(Samsung j8), it looks good as I expected

GIF

Why is this the best possible solution

Made 2 drawable resource files so 2 buttons look different and applied the background to the buttons also. and added the same layout to fill forms and blank forms and main activity also

How does this change affect users? Describe intentional changes to behavior and behavior that could have accidentally been affected by code changes. In other words, what are the regression risks?

As by updating the UI so it holds good for user experience and so the app looks like beautiful

Before submitting this PR, please make sure you have:

run ./gradlew pmd checkstyle lint findbugs and confirmed all checks still pass OR confirm CircleCI build passes
verified that any code or assets from external sources are properly credited in comments and/or in the about file.

ajay-prabhakar · 2019-04-03T10:33:39Z

@shobhitagarwal1612 @lakshyagupta21 I made the suggestions given by you can you have a look now

ajay-prabhakar · 2019-04-03T10:42:22Z

@lakshyagupta21 as you suggested that background color white is looking odd I tried some of the other colors similar to the primary color of the app but it does not looks good

shobhitagarwal1612 · 2019-04-04T16:40:41Z

The disabled buttons look just like enabled. Please fix

ajay-prabhakar · 2019-04-04T16:44:39Z

The disabled buttons look just like enabled. Please fix

Initially, I made in the color of gray but @lakshyagupta21 suggested me to make it into app primary color so I made like that, can you suggest me color to make it

shobhitagarwal1612 · 2019-04-04T16:53:58Z

The text color should be grayed out similar to the original button's implementation.

ajay-prabhakar · 2019-04-08T15:12:44Z

@shobhitagarwal1612 @lakshyagupta21 I made the changes suggested by you and I updated how it looks like in PR template can you please review it

shobhitagarwal1612

The buttons look great now and work as expected. Nice work @Chromicle 👍
Just a small nitpick and this is good to be merged

shobhitagarwal1612 · 2019-04-16T17:07:48Z

skunkworks_crow/src/main/res/drawable/selector_bottom_recive.xml

+
+    <item>
+        <shape>
+            <solid android:color="	#D3D3D3" />


Please fix this spacing and add the color to the colors.xml

shobhitagarwal1612 · 2019-04-16T17:11:40Z

skunkworks_crow/src/main/res/layout/activity_main.xml

        android:layout_alignParentBottom="true"
-        android:orientation="horizontal"
-        android:weightSum="2">
+        android:background="#ffffff"


Please avoid using raw values wherever possible.
This can be replaced with @android:color/white

Done instead of @android: color/white I used @android: color/colorTabActive as this is initialized before only

@Chromicle Sometimes variable name or resources name may confuse someone(as in this case colorTabActive is reserved for tabs related activity but if someone in future changes this value then it will reflect here as well) so its better to use @android:color/white

@Chromicle Sometimes variable name or resources name may confuse someone(as in this case colorTabActive is reserved for tabs related activity but if someone in future changes this value then it will reflect here as well) so it's better to use @android:color/white

I made the changes can you have a look now

lakshyagupta21 · 2019-04-16T18:31:30Z

skunkworks_crow/src/main/res/values/colors.xml

@@ -5,4 +5,5 @@
    <color name="colorAccent">#00796B</color>
    <color name="colorTabInactive">#CFD8DC</color>
    <color name="colorTabActive">#FFFFFF</color>
+    <color name="lightGray">#D3D3D3</color>


Give some meaningful name(for e.g. if you're using it for button border then name it buttonBorder)

yeah, I named it to colorButtonDisabled

huangyz0918 · 2019-04-28T08:29:23Z

skunkworks_crow/src/main/java/org/odk/share/fragments/BlankFormsFragment.java

@@ -193,8 +193,12 @@ private void toggleButtonLabel() {
        }
        if (selectedForms.isEmpty()) {
            sendButton.setText(getString(R.string.send_forms));
+            sendButton.setBackground(getResources().getDrawable(R.drawable.selector_bottom_recive));


sendButton.setText(getString(R.string.send_forms)); sendButton.setBackground(getResources().getDrawable(R.drawable.selector_bottom_recive)); sendButton.setTextColor(getResources().getColor(R.color.colorPrimary));

It will be good for you to extract those similar code to a function like updateSendButton(String newText, @DrawableRes int newDrawableRes, @ColorRes int newTextColor).

huangyz0918 · 2019-04-28T08:30:48Z

skunkworks_crow/src/main/res/layout/activity_main.xml

@@ -21,37 +21,66 @@
            android:layout_centerHorizontal="true"
            android:layout_centerVertical="true"
            android:gravity="center"
-            android:textSize="22sp"
-            android:padding="10dp"/>
+            android:padding="10dp"


avoid hard coding is better, you can replace the padding by @dimen/default_padding_2.5x.

Until now we have not used @dimen so made like hardcoded or else I will make into that way only

huangyz0918 · 2019-04-28T08:31:58Z

skunkworks_crow/src/main/res/layout/activity_main.xml

+            android:layout_weight="1"
+            android:gravity="center"
+            android:paddingStart="10dp"
+            android:paddingLeft="10dp"


using padding End will make your life easier when facing RTL languages.

huangyz0918 · 2019-04-28T08:32:27Z

skunkworks_crow/src/main/res/layout/fragment_forms.xml

@@ -11,43 +11,65 @@
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:gravity="center"
-        android:textSize="22sp"
-        android:padding="10dp"/>
+        android:padding="10dp"


The same as above.

huangyz0918 · 2019-04-28T08:36:12Z

skunkworks_crow/src/main/res/layout/fragment_forms.xml

+            android:gravity="center"
+            android:padding="10dp">
+
+            <Button


toggle_button has so many attrs the same as send_button , consider extract them into style.xml.

lakshyagupta21 · 2019-04-28T12:14:22Z

skunkworks_crow/src/main/res/values/colors.xml

@@ -5,4 +5,6 @@
    <color name="colorAccent">#00796B</color>
    <color name="colorTabInactive">#CFD8DC</color>
    <color name="colorTabActive">#FFFFFF</color>
+    <color name="colorButtonDisabled">#D3D3D3</color>
+    <color name="white">#FFFFFF</color>


We discussed this @Chromicle in some other PR that avoid naming color resources with the actual color names, give some meaningful names to them, In this case we can remove the white color resource as you can directly use it like android:color/white

yeah! I updated

lakshyagupta21 · 2019-06-11T17:52:12Z

@Chromicle Can you resolve the conflicts?

ajay-prabhakar · 2020-01-09T14:45:37Z

@lakshyagupta21 @shobhitagarwal1612 I have done the changes and I added the styles instead of adding same to code to everywhere and I did testing twice and it is working perfectly as accepted
can you please review now

ajay-prabhakar · 2020-02-04T13:08:23Z

@lakshyagupta21 @huangyz0918 can you please review this PR as there are a lot of file changes every time new PR merges I have to solve the conflict

shobhitagarwal1612 suggested changes Apr 16, 2019

View reviewed changes

lakshyagupta21 suggested changes Apr 16, 2019

View reviewed changes

huangyz0918 reviewed Apr 28, 2019

View reviewed changes

lakshyagupta21 reviewed Apr 28, 2019

View reviewed changes

ajay-prabhakar changed the title ~~Updated UI the bottom bar layout, so it looks good~~ Improvements in bottom bar layout Jun 5, 2019

feat: Improvements in bottom bar layout

e1d99bd

ajay-prabhakar force-pushed the onther branch from 0c807f3 to e1d99bd Compare January 9, 2020 14:37

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Improvements in bottom bar layout #235

Improvements in bottom bar layout #235

ajay-prabhakar commented Apr 2, 2019 •

edited

Loading

ajay-prabhakar commented Apr 3, 2019

ajay-prabhakar commented Apr 3, 2019 •

edited

Loading

shobhitagarwal1612 commented Apr 4, 2019

ajay-prabhakar commented Apr 4, 2019

shobhitagarwal1612 commented Apr 4, 2019

ajay-prabhakar commented Apr 8, 2019

shobhitagarwal1612 left a comment

shobhitagarwal1612 Apr 16, 2019

ajay-prabhakar Apr 16, 2019

shobhitagarwal1612 Apr 16, 2019

ajay-prabhakar Apr 16, 2019

lakshyagupta21 Apr 16, 2019

ajay-prabhakar Apr 16, 2019 •

edited

Loading

lakshyagupta21 Apr 16, 2019

ajay-prabhakar Apr 16, 2019

huangyz0918 Apr 28, 2019

huangyz0918 Apr 28, 2019

ajay-prabhakar Apr 28, 2019

huangyz0918 Apr 28, 2019

huangyz0918 Apr 28, 2019

huangyz0918 Apr 28, 2019

lakshyagupta21 Apr 28, 2019

ajay-prabhakar Apr 28, 2019 •

edited

Loading

lakshyagupta21 commented Jun 11, 2019

ajay-prabhakar commented Jan 9, 2020

ajay-prabhakar commented Feb 4, 2020

Improvements in bottom bar layout #235

Are you sure you want to change the base?

Improvements in bottom bar layout #235

Conversation

ajay-prabhakar commented Apr 2, 2019 • edited Loading

What has been done to verify that this 4works as intended?

GIF

Why is this the best possible solution

How does this change affect users? Describe intentional changes to behavior and behavior that could have accidentally been affected by code changes. In other words, what are the regression risks?

Before submitting this PR, please make sure you have:

ajay-prabhakar commented Apr 3, 2019

ajay-prabhakar commented Apr 3, 2019 • edited Loading

shobhitagarwal1612 commented Apr 4, 2019

ajay-prabhakar commented Apr 4, 2019

shobhitagarwal1612 commented Apr 4, 2019

ajay-prabhakar commented Apr 8, 2019

shobhitagarwal1612 left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

ajay-prabhakar Apr 16, 2019 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

ajay-prabhakar Apr 28, 2019 • edited Loading

Choose a reason for hiding this comment

lakshyagupta21 commented Jun 11, 2019

ajay-prabhakar commented Jan 9, 2020

ajay-prabhakar commented Feb 4, 2020

ajay-prabhakar commented Apr 2, 2019 •

edited

Loading

ajay-prabhakar commented Apr 3, 2019 •

edited

Loading

ajay-prabhakar Apr 16, 2019 •

edited

Loading

ajay-prabhakar Apr 28, 2019 •

edited

Loading