Adding shadow to ActionButton in Android

[Yurrili]

I have huge problem with adding shadow to the ActionButton, even if ShadowHide is false, there is no shadow under the button, i tried to add style to param ShadowStyle, but this isn't working. Could you help me ?

My ActionButton definition:

<ActionButton
            buttonColor={variables.brandDanger}
            size={55}
            position="left"
            icon={
              <Icon
                name="ios-information-circle-outline"
                style={{ fontSize: 25 }}
              />
            }
          shadowStyle={{
              shadowColor: "#000000",
              shadowOpacity: 0.8,
              shadowRadius: 2,
              shadowOffset: {
                height: 1,
                width: 0
              }
            }}
}

[diegocouto]

I've started to face this same issue recently, after an update from version 2.6.x to 2.8.1.

[tiendv89]

There was a commit (3d9be2c9bda84ebe8261487d898a12c4bf2add95) the breaks the shadow on Android. I couldn't have time to understand why but I notice that the fixNativeFeedbackRadius change the style on the parentView of the main button.

Setting fixNativeFeedbackRadius = true on the component props temporarily enable the shadow.

[davidroman0O]

Thanks a lot @tiendv89 for this quick fix :)

[mopitz199]

So the finall code is?:

<ActionButton buttonColor={variables.brandDanger} size={55} position="left" fixNativeFeedbackRadius = {true} icon={ <Icon name="ios-information-circle-outline" style={{ fontSize: 25 }} /> } shadowStyle={{ shadowColor: "#000000", shadowOpacity: 0.8, shadowRadius: 2, shadowOffset: { height: 1, width: 0 } }} }

Because I'm still not seeing the shadow

[amaury1093]

fixNativeFeedbackRadius broke the position={center} for me (not centered in the middle exactly).

I rolled back to 2.7.2, and everything's working.

[ujjwalagrawal17]

Thanks :)

[ishigamii]

Any update on this cause the shadow works perfectly on ios but on android just nothing.

Using fixNativeFeedbackRadius with postion={left} put the action button out of screen so it's not a solution.

[vaibsshukla]

Just simply change shadow style in shared.js file

export const shadowStyle = { shadowOpacity: 0.35, shadowOffset: { width: 0, height: 5 }, shadowColor: '#000', shadowRadius: 3, elevation: 0, <========== Change elevation };

[ymarin338]

There was a commit (3d9be2c) the breaks the shadow on Android. I couldn't have time to understand why but I notice that the fixNativeFeedbackRadius change the style on the parentView of the main button.

Setting fixNativeFeedbackRadius = true on the component props temporarily enable the shadow.

Excelent, this worked

[drdpedroso]

There was a commit (3d9be2c) the breaks the shadow on Android. I couldn't have time to understand why but I notice that the fixNativeFeedbackRadius change the style on the parentView of the main button.

Setting fixNativeFeedbackRadius = true on the component props temporarily enable the shadow.

This is also working for 2.8.5

[muhammadtaha1998]

Any solution yet? I have tried everything but got no shadow.

[muhammadtaha1998]

Setting fixNativeFeedbackRadius to true shows the shadow but offsets the button if it is positioned in the enter or to the left. Any solution for that?

[thebuddysystem]

I would also love an update. Doing all of the above suggestions does nothing for me... wiht the exception of using fixNativeFeedbackRadius={true}, it just offsets the (shadowless) button about 30 pixels to the left (my position is set to 'center'). Would be much appreciated!