1

There are a few answers on stackoverflow, but none of them seem to help. What I'm trying to achieve is not only the transparent background but also the glowing that happens when the button is clicked and the borders as well.

What I tried so far:

 android:background="?android:attr/selectableItemBackground"

The results (when the button is not clicked):

enter image description here

The results (when the button is clicked):

enter image description here

This is basically what I want to achieve, except that the button have no borders.

I tried to set strokeColor and strokeWidth but that didn't do anything. I still get the same results as above.

I also tried to use the Material Outlined Button style which worked fine however, I couldn't get the glowing effect when the button is tapped to work. It was basically like clicking in a textView.

The closest I could find to my problem is this answer: Shaped drawable with selectableItemBackground as background

It works perfectly, except for the border color. For some reason, it's showing PURPLE (which is my primary color) instead of black as it should.

androidtroubler
  • 23
  • 6
  • I can't tell from your description whether your button should have a drawn border or not. Do you just mean you want the ripple effect to be bounded by a shape, or do you want an outline drawn around the button? – Tenfour04 May 18 '22 at 16:20
  • I want an outline drawn around my border as shown here: https://stackoverflow.com/questions/43284336/shaped-drawable-with-selectableitembackground-as-background I tried this solution and many others, but for some reason, my colorPrimary is enforced. What could be the reason? – androidtroubler May 18 '22 at 16:27
  • Are you modifying the shape into something other than a rectangle with rounded corners? – Tenfour04 May 18 '22 at 16:32
  • @Tenfour04 No, I'm not. In short, what I want to achieve is this: A transparent button with rounded corners and border color of my choice. The link above seem to do it all, but for some reason, its applying the colorPrimary like I said. – androidtroubler May 18 '22 at 16:55

1 Answers1

1

If you use a Material Components theme, and apply the Material outlined button style to a button, it will appear as I think you're describing.

<Button
    android:id="@+id/button"
    style="@style/Widget.MaterialComponents.Button.OutlinedButton"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/button" />
Tenfour04
  • 83,111
  • 11
  • 94
  • 154
  • That did the trick, however... I still have a ripple effect in light purple whenever I click the button. Is there a way to get rid of that? https://i.imgur.com/pMbAjFS.png – androidtroubler May 18 '22 at 17:08
  • You want to change the ripple color to something else? Only for this button, or across your whole theme? – Tenfour04 May 18 '22 at 17:10
  • I want to change it for only this button. I want it to look like the Google button I showed on my post when clicked. – androidtroubler May 18 '22 at 17:12
  • `app:rippleColor="#ffffff"` You can experiment with the opacity of the color it uses here. I'm not sure if just overrides your opacity with 12% though. – Tenfour04 May 18 '22 at 17:16