Elevation???

[Jamal-ReachFirst]

Unable to add elevation or shadow to bottom tab bar, I don't want to add stroke.

Is there anyway to add shadow to its top side on android.

[hoaphantn7604]

Hi @Jamal-ReachFirst ,
I’m working on it.

[Jamal-ReachFirst]

Hi @Jamal-ReachFirst , I’m working on it.

I am using react-native-drop-shadow to apply shadow.

Make some changes in react-native-curved-bottom-bar:

import DropShadow from "react-native-drop-shadow";

<DropShadow
    style={{
      shadowColor: "#DDDDDD",
      shadowOffset: {
        width: 0,
        height: 0,
      },
      shadowOpacity: 1,
      shadowRadius: 5,
    }}
  >
      <SVG width={maxWidth} height={height + (type === 'DOWN' ? 0 : 30)}>
        <PATH
          fill={bgColor}
          stroke="#DDDDDD"
          strokeWidth={strokeWidth}
          {...{ d }}
        />
      </SVG>
  </DropShadow>

Thanks.

[hoaphantn7604]

Hi @Jamal-ReachFirst , I’m working on it.

I am using react-native-drop-shadow to apply shadow.

Make some changes in react-native-curved-bottom-bar:

import DropShadow from "react-native-drop-shadow";

<DropShadow
    style={{
      shadowColor: "#DDDDDD",
      shadowOffset: {
        width: 0,
        height: 0,
      },
      shadowOpacity: 1,
      shadowRadius: 5,
    }}
  >
      <SVG width={maxWidth} height={height + (type === 'DOWN' ? 0 : 30)}>
        <PATH
          fill={bgColor}
          stroke="#DDDDDD"
          strokeWidth={strokeWidth}
          {...{ d }}
        />
      </SVG>
  </DropShadow>

Thanks.

Thank you very helpful.

[hoaphantn7604]

hi All, Top shadow do not working on Android. I'm find solutions.

[Jamal-ReachFirst]

hi All, Top shadow do not working on Android. I'm find solutions.

What is the solution, when are you going to push it to this package?

[BillDelvin]

hi All, Top shadow do not working on Android. I'm find solutions.

can I know what is the solution ?

[Jamal-ReachFirst]

react-native-drop-shadow

react-native-drop-shadow use this

[BillDelvin]

did you have example code for reference ?

[Jamal-ReachFirst]

did you have example code for reference ?

As shown here

import DropShadow from "react-native-drop-shadow";

<DropShadow
    style={{
      shadowColor: "#DDDDDD",
      shadowOffset: {
        width: 0,
        height: 0,
      },
      shadowOpacity: 1,
      shadowRadius: 5,
    }}
  >
      // child component
  </DropShadow>

[hoaphantn7604]

hi All,
This issue is resolved. Please install version 3.1.0 Later re-build app.
add shadow (9fb40da)

[Jamal-ReachFirst]

hi All, This issue is resolved. Please install version 3.1.0 Later re-build app. add shadow (9fb40da)

@hoaphantn7604 Thanks for your efforts and hard work, the shadow is working now but I am unable to change the shadow properties (no method/prop provided to override the existing shadow style).

I am manually changing the shadow style inside react-native-curved-bottom-bar/src/CurvedBottomBar/Components/BottomBarView/styles.ts

shadow: {
    shadowColor: '#DDDDDD',
    shadowOffset: {
      width: 0,
      height: 0,
    },
    shadowOpacity: 1,
    shadowRadius: 5,
  },

Can you please provide a method/prop to override this style??

[hoaphantn7604]

hi All, This issue is resolved. Please install version 3.1.0 Later re-build app. add shadow (9fb40da)

@hoaphantn7604 Thanks for your efforts and hard work, the shadow is working now but I am unable to change the shadow properties (no method/prop provided to override the existing shadow style).

I am manually changing the shadow style inside react-native-curved-bottom-bar/src/CurvedBottomBar/Components/BottomBarView/styles.ts

shadow: {
    shadowColor: '#DDDDDD',
    shadowOffset: {
      width: 0,
      height: 0,
    },
    shadowOpacity: 1,
    shadowRadius: 5,
  },

Can you please provide a method/prop to override this style??

This issue is resolved. Install new version. You can use shadowStyle props.

[ecartersupport]

It's not working in Android. It's not showing any shadow