javascript/NativeScript
1
0
Fork 0
mirror of https://github.com/NativeScript/NativeScript.git synced 2025-11-04 04:18:52 +08:00
Code Issues Packages Projects Releases Wiki Activity

revert: "fix(ios): apply proper border radius to box shadow and view sublayers (#9881)" (#9917)

Browse Source 
This reverts commit 3d882b0999ca25cbab104700eb483bc5d5d9a1ab.
This commit is contained in:
Nathan Walker
2022-05-19 14:11:48 -07:00
parent d3718e5e5f
commit 50fd3c06f8
1 changed files with 3 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
packages/core/ui/styling/background.ios.ts
View File

@ -712,7 +712,6 @@ function drawNoRadiusNonUniformBorders(nativeView: NativeScriptUIView, backgroun
// TODO: use sublayer if its applied to a layout // TODO: use sublayer if its applied to a layout
function drawBoxShadow(nativeView: NativeScriptUIView, view: View, boxShadow: CSSShadow, background: BackgroundDefinition, useSubLayer: boolean = false) { function drawBoxShadow(nativeView: NativeScriptUIView, view: View, boxShadow: CSSShadow, background: BackgroundDefinition, useSubLayer: boolean = false) {
const layer: CALayer = iOSNativeHelper.getShadowLayer(nativeView, 'ns-box-shadow'); const layer: CALayer = iOSNativeHelper.getShadowLayer(nativeView, 'ns-box-shadow');
const renderSize = view.getActualSize() || { width: 0, height: 0 };
layer.masksToBounds = false; layer.masksToBounds = false;
nativeView.clipsToBounds = false; nativeView.clipsToBounds = false;
@ -721,23 +720,10 @@ function drawBoxShadow(nativeView: NativeScriptUIView, view: View, boxShadow: CS
// nativeView.clipsToBounds doesn't work // nativeView.clipsToBounds doesn't work
view.setProperty('clipToBounds', false); view.setProperty('clipToBounds', false);
// This should match the view's border radius (only uniform radius is supported for now)
let cornerRadius = layout.toDeviceIndependentPixels(background.borderTopLeftRadius);
cornerRadius = Math.min(Math.min(renderSize.width / 2, renderSize.height / 2), cornerRadius);
// Apply corner radius to sub layers as clipToBounds and masksToBounds are now set to false
const sublayers = nativeView.layer?.sublayers;
if (sublayers) {
for (let i = 0; i < sublayers.count; i++) {
sublayers.objectAtIndex(i).cornerRadius = cornerRadius;
}
}
if (!background.color?.a) { if (!background.color?.a) {
// add white background if view has a transparent background // add white background if view has a transparent background
layer.backgroundColor = UIColor.whiteColor.CGColor; layer.backgroundColor = UIColor.whiteColor.CGColor;
} }
// shadow opacity is handled on the shadow's color instance // shadow opacity is handled on the shadow's color instance
layer.shadowOpacity = boxShadow.color?.a ? boxShadow.color?.a / 255 : 1; layer.shadowOpacity = boxShadow.color?.a ? boxShadow.color?.a / 255 : 1;
layer.shadowRadius = Length.toDevicePixels(boxShadow.blurRadius, 0.0); layer.shadowRadius = Length.toDevicePixels(boxShadow.blurRadius, 0.0);
@ -749,6 +735,9 @@ function drawBoxShadow(nativeView: NativeScriptUIView, view: View, boxShadow: CS
Length.toDevicePixels(boxShadow.offsetY, 0.0) Length.toDevicePixels(boxShadow.offsetY, 0.0)
); );
// this should match the view's border radius
const cornerRadius = Length.toDevicePixels(<CoreTypes.LengthType>view.style.borderRadius, 0.0);
// apply spreadRadius by expanding shadow layer bounds // apply spreadRadius by expanding shadow layer bounds
// prettier-ignore // prettier-ignore
const bounds = CGRectInset(nativeView.bounds, const bounds = CGRectInset(nativeView.bounds,
@ -762,18 +751,10 @@ function drawBoxShadow(nativeView: NativeScriptUIView, view: View, boxShadow: CS
function clearBoxShadow(nativeView: NativeScriptUIView) { function clearBoxShadow(nativeView: NativeScriptUIView) {
nativeView.clipsToBounds = true; nativeView.clipsToBounds = true;
const sublayers = nativeView.layer?.sublayers;
if (sublayers) {
for (let i = 0; i < sublayers.count; i++) {
sublayers.objectAtIndex(i).cornerRadius = 0.0;
}
}
const layer: CALayer = iOSNativeHelper.getShadowLayer(nativeView, 'ns-box-shadow', false); const layer: CALayer = iOSNativeHelper.getShadowLayer(nativeView, 'ns-box-shadow', false);
if (!layer) { if (!layer) {
return; return;
} }
layer.masksToBounds = true; layer.masksToBounds = true;
layer.shadowOffset = CGSizeMake(0, 0); layer.shadowOffset = CGSizeMake(0, 0);
layer.shadowColor = UIColor.clearColor.CGColor; layer.shadowColor = UIColor.clearColor.CGColor;