How to add an colored underline to a button on Xamarin.Forms Android

I am trying to add a colored underline to a Button on Xamarin.Forms. I made a custom renderer for iOS and got that working, but I can't seem to figure out a way to do it with a custom renderer on Android. The only thing i've found was adding a same color underline, but I want it to be a certain thickness and color. Anyone know how to handle this on Android?

Answers

  • seanydaseanyda GBMember ✭✭✭✭✭
    edited December 2017

    @JoshuaNovak.6915 said:
    I am trying to add a colored underline to a Button on Xamarin.Forms. I made a custom renderer for iOS and got that working, but I can't seem to figure out a way to do it with a custom renderer on Android. The only thing i've found was adding a same color underline, but I want it to be a certain thickness and color. Anyone know how to handle this on Android?

    If you placed a BoxView with a HeightRequest of the "line" you want it to be, in a Grid with a Button.

    Something like the below would work...

    Grid customBtn = new Grid
        {
             Children = {
                      new Button { /* Button Properties */ },
                      new BoxView { VerticalOptions = LayoutOptions.End, HeightRequest = 1, BackgroundColor = Color.Red }
              }
        };
    

    and this would be a cross platform solution, so you can ditch your iOS, Droid and UWP renderers.

  • @seanyda I'm trying to keep my views somewhat clean and not have 3 views for something that should just be one. This also doesn't work well since you can't click the line.

  • seanydaseanyda GBMember ✭✭✭✭✭
    edited December 2017

    @JoshuaNovak.6915 said:
    @seanyda I'm trying to keep my views somewhat clean and not have 3 views for something that should just be one. This also doesn't work well since you can't click the line.

    You would be able to add a TapGestureRecognizer to the whole Grid, which contains the Button and BoxView. A lot of developers find it a much cleaner solution to use a Grid instead of a Button because it's a nicer cross platform solution because the effect will be identical across iOS, Android and Windows - However building custom renderers for each platform for that effect would probably be less efficient or clean.

  • @seanyda I disagree. It's way less clean to have 3 views try to act as one view and not even get the native effects when that is the whole point of the platform to begin with. Not to mention that is 3 views for every one that Android now has to render and I all ready have a lot of views in my app.

  • @seanyda said:

    @JoshuaNovak.6915 said:
    I am trying to add a colored underline to a Button on Xamarin.Forms. I made a custom renderer for iOS and got that working, but I can't seem to figure out a way to do it with a custom renderer on Android. The only thing i've found was adding a same color underline, but I want it to be a certain thickness and color. Anyone know how to handle this on Android?

    If you placed a BoxView with a HeightRequest of the "line" you want it to be, in a Grid with a Button.

    Something like the below would work...

    Grid customBtn = new Grid
        {
             Children = {
                      new Button { /* Button Properties */ },
                      new BoxView { VerticalOptions = LayoutOptions.End, HeightRequest = 1, BackgroundColor = Color.Red }
              }
        };
    

    and this would be a cross platform solution, so you can ditch your iOS, Droid and UWP renderers.

    Thank you so much....

Sign In or Register to comment.