I m creating a Sign in with Google button for my Android app kotlinlang #compose

I'm creating a "Sign in with Google"-button for my Android app and looking at https://developers.google.com/identity/branding-guidelines for guidence. However, when adding the icon it seems the image get's some sort of border/shadow. How do I remove that?

Copy code

Button(
                    onClick = {
                        Log.d("Login", "ButtonClicked!")
                        handleLoginButtonPress(loginFragment, context)
                    },
                    backgroundColor = Color.White,
                    padding = InnerPadding(8.dp)
                ) {
                    Image(
                        asset = imageResource(id = R.drawable.btn_google_light_normal_hdpi),
                        modifier = Modifier.height(40.dp)
                            .padding(0.dp)
                            .absolutePadding(0.dp, 0.dp, 0.dp, 0.dp)
                            .drawShadow(0.dp),
                        contentScale = ContentScale.Inside
                    )
                    Text(
                        "Sign in with Google",
                        color = Color(75, 75, 75),
                        fontFamily = fontFamily(listOf(font(R.font.roboto_medium))),
                        modifier = Modifier.padding(24.dp, 0.dp, 0.dp, 0.dp)
                    )
                }

Adam Powell

07/29/2020, 4:22 PM

.drawShadow(0.dp)

those padding modifiers of 0 are not doing anything for you either; modifiers are always additive, they don't remove, replace or reset other properties that come from elsewhere.

Horv

07/29/2020, 4:27 PM

Ah, I see. I think the issue might have been the image I used. Switched to a svg-version and imported by Android Studio by creating a vector asset and it's looking a lot better.

👍 1

4 Views