'How to design button with box shadow in native script

I am new in native script.I want to design button with box shadow 

.boxShadow {
   box-shadow: 10px 10px 5px grey;
}
<Button class="boxShadow" text="submit"></Button>
htmlxmlnativescriptnativescript-angular


Solution 1:[1]

Support for box-shadow is still an open feature request. The workaround is to use nativescript-cardview plugin.

Update: The css attribute is now supported in NS8+

Solution 2:[2]

i got plugin called "nativescript-ng-shadow" its works for me

Solution 3:[3]

You can use for Android

.tvElevation{
    android-elevation:5;
}

see documentation enter link description here

Solution 4:[4]

Box-shadow is now supported in nativescript 8:

.boxShadow {
   box-shadow: 0 0 5px rgba(0, 0, 0, 0.8);
   box-shadow: 0 0 5px #000000;
}

.anotherBoxShadow {
   box-shadow: 0 0 5px #000000;
}

<Button class="boxShadow" text="submit"></Button>

More details here: ns8 announcement

Solution 5:[5]

You can set your style with Js by following code

const btn = document.querySelector('#boxShadow');
btn.style.boxShadow = '10px 10px 5px grey';
<Button id="boxShadow" text="submit">btn</Button>

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1
Solution 2 Amar Yadav
Solution 3 Anna Melkonyan
Solution 4 Lorraine R.
Solution 5 ali memar

Related Questions