From: Eunki, Hong Date: Thu, 11 Jul 2024 04:39:10 +0000 (+0900) Subject: [NUI] Support Shadow and ColorVisual cutout policy X-Git-Tag: submit/tizen/20240731.020124~1^2~7 X-Git-Url: http://review.tizen.org/git/?a=commitdiff_plain;h=d58ff8d6ccc551359aae23df1ea84ac36d155596;p=platform%2Fcore%2Fcsapi%2Ftizenfx.git [NUI] Support Shadow and ColorVisual cutout policy Let we support to BoxShadow and ColorVisual, to ignore rendering inside of View area. None is default, same as previous logics. CutoutView is cutout render area as bounding box of view. It is faster than CutoutViewWithCornerRadius. CutoutWithCornerRadius is cutout render area consider the corner radius of view. Required dali patch : https://review.tizen.org/gerrit/c/platform/core/uifw/dali-toolkit/+/314255 Signed-off-by: Eunki, Hong --- diff --git a/src/Tizen.NUI/src/public/ViewProperty/Shadow.cs b/src/Tizen.NUI/src/public/ViewProperty/Shadow.cs index eecbd12df..d6401bfb6 100755 --- a/src/Tizen.NUI/src/public/ViewProperty/Shadow.cs +++ b/src/Tizen.NUI/src/public/ViewProperty/Shadow.cs @@ -39,6 +39,7 @@ namespace Tizen.NUI public Shadow() : base() { BlurRadius = 0; + CutoutPolicy = ColorVisualCutoutPolicyType.None; Color = defaultColor; } @@ -50,9 +51,23 @@ namespace Tizen.NUI /// Optional. The position offset value (x, y) from the top left corner. See . /// Optional. The shadow will extend its size by specified amount of length. See . /// 9 - public Shadow(float blurRadius, Color color, Vector2 offset = null, Vector2 extents = null) : base(offset, extents) + public Shadow(float blurRadius, Color color, Vector2 offset = null, Vector2 extents = null) : this(blurRadius, ColorVisualCutoutPolicyType.None, color, offset, extents) + { + } + + /// + /// Create a Shadow with custom values. + /// + /// The blur radius value for the shadow. Bigger value, much blurry. + /// The policy of the shadow cutout. + /// The color for the shadow. + /// Optional. The position offset value (x, y) from the top left corner. See . + /// Optional. The shadow will extend its size by specified amount of length. See . + [EditorBrowsable(EditorBrowsableState.Never)] + public Shadow(float blurRadius, ColorVisualCutoutPolicyType cutoutPolicy, Color color, Vector2 offset = null, Vector2 extents = null) : base(offset, extents) { BlurRadius = blurRadius; + CutoutPolicy = cutoutPolicy; Color = color == null ? new Color(defaultColor) : new Color(color); } @@ -61,7 +76,7 @@ namespace Tizen.NUI /// /// Thrown when other is null. [EditorBrowsable(EditorBrowsableState.Never)] - public Shadow(Shadow other) : this(other == null ? throw new ArgumentNullException(nameof(other)) : other.BlurRadius, other.Color, other.Offset, other.Extents) + public Shadow(Shadow other) : this(other == null ? throw new ArgumentNullException(nameof(other)) : other.BlurRadius, other.CutoutPolicy, other.Color, other.Offset, other.Extents) { } @@ -93,12 +108,24 @@ namespace Tizen.NUI /// /// The blur radius value for the shadow. Bigger value, much blurry. /// - /// + /// /// Negative value is ignored. (no blur) - /// + /// /// 9 public float BlurRadius { get; internal set; } + /// + /// The Cutout policy for this shadow. + /// + /// + /// ColorVisualCutoutPolicyType.None = Fully render the shadow color (Default)
+ /// ColorVisualCutoutPolicyType.CutoutView = Do not render inside bounding box of view
+ /// ColorVisualCutoutPolicyType.CutoutViewWithCornerRadius = Do not render inside view, consider corner radius value
+ /// We don't support this property for xaml yet. + /// + [EditorBrowsable(EditorBrowsableState.Never)] + public ColorVisualCutoutPolicyType CutoutPolicy { get; internal set;} + /// [EditorBrowsable(EditorBrowsableState.Never)] public override bool Equals(object other) @@ -127,6 +154,7 @@ namespace Tizen.NUI int hash = base.GetHashCode(); hash = (hash * 7) + (Color == null ? 0 : Color.GetHashCode()); hash = (hash * 7) + (BlurRadius.GetHashCode()); + hash = (hash * 7) + (CutoutPolicy.GetHashCode()); return hash; } } @@ -152,6 +180,8 @@ namespace Tizen.NUI map[ColorVisualProperty.BlurRadius] = new PropertyValue(BlurRadius < 0 ? 0 : BlurRadius); + map[ColorVisualProperty.CutoutPolicy] = new PropertyValue((int)CutoutPolicy); + return map; } } diff --git a/src/Tizen.NUI/src/public/Visuals/VisualConstants.cs b/src/Tizen.NUI/src/public/Visuals/VisualConstants.cs index e80aa64f4..c72f45328 100755 --- a/src/Tizen.NUI/src/public/Visuals/VisualConstants.cs +++ b/src/Tizen.NUI/src/public/Visuals/VisualConstants.cs @@ -663,16 +663,24 @@ namespace Tizen.NUI /// /// 3 public static readonly int MixColor = NDalic.ColorVisualMixColor; + /// /// Whether to render if the MixColor is transparent. /// /// 5 public static readonly int RenderIfTransparent = NDalic.ColorVisualMixColor + 1; + /// - /// Then radius value for the area to blur. + /// The radius value for the area to blur. /// [EditorBrowsable(EditorBrowsableState.Never)] public static readonly int BlurRadius = NDalic.ColorVisualMixColor + 2; + + /// + /// The policy value for the cutout of the visual. + /// + [EditorBrowsable(EditorBrowsableState.Never)] + public static readonly int CutoutPolicy = NDalic.ColorVisualMixColor + 3; } /// @@ -1370,4 +1378,33 @@ namespace Tizen.NUI /// Multiply }; + + /// + /// Defines how a colorvisual cutout + /// + /// This will be public opened after ACR done. Before ACR, need to be hidden as inhouse API. + [EditorBrowsable(EditorBrowsableState.Never)] + public enum ColorVisualCutoutPolicyType + { + /// + /// No cutout. (default) + /// + [EditorBrowsable(EditorBrowsableState.Never)] + None, + /// + /// Cutout as bounding box of view + /// + [EditorBrowsable(EditorBrowsableState.Never)] + CutoutView, + /// + /// Cutout as bounding box of view, include corner radius. + /// + /// + /// The CornerRadius and CornerRadiusPolicy will be used color visual itself's value. + /// If you are using this policy at Tizen.NUI.Visuals.ColorVisual, please be careful that CornerRadius value + /// is not same as View.CornerRadius. + /// + [EditorBrowsable(EditorBrowsableState.Never)] + CutoutViewWithCornerRadius, + }; } diff --git a/src/Tizen.NUI/src/public/Visuals/VisualObject/ColorVisual.cs b/src/Tizen.NUI/src/public/Visuals/VisualObject/ColorVisual.cs index 9d6d8d7c1..a3b0af8cc 100644 --- a/src/Tizen.NUI/src/public/Visuals/VisualObject/ColorVisual.cs +++ b/src/Tizen.NUI/src/public/Visuals/VisualObject/ColorVisual.cs @@ -68,6 +68,25 @@ namespace Tizen.NUI.Visuals return ret; } } + + /// + /// Cutout policy of color visual + /// + [EditorBrowsable(EditorBrowsableState.Never)] + public ColorVisualCutoutPolicyType CutoutPolicy + { + set + { + UpdateVisualProperty((int)Tizen.NUI.ColorVisualProperty.CutoutPolicy, new PropertyValue((int)value)); + } + get + { + int ret = (int)ColorVisualCutoutPolicyType.None; + var propertyValue = GetCachedVisualProperty((int)Tizen.NUI.ColorVisualProperty.CutoutPolicy); + propertyValue?.Get(out ret); + return (ColorVisualCutoutPolicyType)ret; + } + } #endregion #region Decorated Visual Properties diff --git a/test/NUITizenGallery/Examples/ShadowFrameTest/ShadowFrameTest1Page.xaml b/test/NUITizenGallery/Examples/ShadowFrameTest/ShadowFrameTest1Page.xaml index 43190c4aa..a12e5abe4 100644 --- a/test/NUITizenGallery/Examples/ShadowFrameTest/ShadowFrameTest1Page.xaml +++ b/test/NUITizenGallery/Examples/ShadowFrameTest/ShadowFrameTest1Page.xaml @@ -327,6 +327,17 @@ + + + diff --git a/test/NUITizenGallery/Examples/ShadowFrameTest/ShadowFrameTest1Page.xaml.cs b/test/NUITizenGallery/Examples/ShadowFrameTest/ShadowFrameTest1Page.xaml.cs index 3224153d4..b04d44a7c 100644 --- a/test/NUITizenGallery/Examples/ShadowFrameTest/ShadowFrameTest1Page.xaml.cs +++ b/test/NUITizenGallery/Examples/ShadowFrameTest/ShadowFrameTest1Page.xaml.cs @@ -7,11 +7,15 @@ namespace NUITizenGallery public partial class ShadowFrameTest1Page : ContentPage { private bool shadowToggleShow; // true if we show shadow + + private ColorVisualCutoutPolicyType shadowCutoutPolicy; // The policy of cutout shadow as view + private Shadow CreateShadowFromeSliders() { return new Shadow ( ShadowBlurRadius.CurrentValue, + shadowCutoutPolicy, new Color( ShadowColorRed.CurrentValue / 255.0f, ShadowColorGreen.CurrentValue / 255.0f, @@ -26,6 +30,7 @@ namespace NUITizenGallery { InitializeComponent(); shadowToggleShow = true; + shadowCutoutPolicy = ColorVisualCutoutPolicyType.None; // CornerRadius CornerTopLeft.ValueChanged += (o, e) => @@ -130,6 +135,21 @@ namespace NUITizenGallery } } }; + // Shadow Cutout Toggle + ShadowCutoutButton.Clicked += (o, e) => + { + if(ShadowCutoutButton.IsSelected) + { + shadowCutoutPolicy = ColorVisualCutoutPolicyType.CutoutViewWithCornerRadius; + } + else + { + shadowCutoutPolicy = ColorVisualCutoutPolicyType.None; + } + + target.BoxShadow = CreateShadowFromeSliders(); + }; + // Shadow Offset ShadowOffsetX.ValueChanged += (o, e) => { @@ -141,7 +161,7 @@ namespace NUITizenGallery return; } Vector2 currentOffset = currentShadow.Offset; - target.BoxShadow = new Shadow(currentShadow.BlurRadius, currentShadow.Color, new Vector2(ShadowOffsetX.CurrentValue, currentOffset.Y)); + target.BoxShadow = new Shadow(currentShadow.BlurRadius, shadowCutoutPolicy, currentShadow.Color, new Vector2(ShadowOffsetX.CurrentValue, currentOffset.Y)); }; ShadowOffsetY.ValueChanged += (o, e) => { @@ -153,7 +173,7 @@ namespace NUITizenGallery return; } Vector2 currentOffset = currentShadow.Offset; - target.BoxShadow = new Shadow(currentShadow.BlurRadius, currentShadow.Color, new Vector2(currentOffset.X, ShadowOffsetY.CurrentValue)); + target.BoxShadow = new Shadow(currentShadow.BlurRadius, shadowCutoutPolicy, currentShadow.Color, new Vector2(currentOffset.X, ShadowOffsetY.CurrentValue)); }; // Shadow Color @@ -167,7 +187,7 @@ namespace NUITizenGallery return; } Color currentColor = currentShadow.Color; - target.BoxShadow = new Shadow(currentShadow.BlurRadius, new Color(ShadowColorRed.CurrentValue / 255.0f, currentColor.G, currentColor.B, currentColor.A), currentShadow.Offset); + target.BoxShadow = new Shadow(currentShadow.BlurRadius, shadowCutoutPolicy, new Color(ShadowColorRed.CurrentValue / 255.0f, currentColor.G, currentColor.B, currentColor.A), currentShadow.Offset); }; ShadowColorGreen.ValueChanged += (o, e) => { @@ -179,7 +199,7 @@ namespace NUITizenGallery return; } Color currentColor = currentShadow.Color; - target.BoxShadow = new Shadow(currentShadow.BlurRadius, new Color(currentColor.R, ShadowColorGreen.CurrentValue / 255.0f, currentColor.B, currentColor.A), currentShadow.Offset); + target.BoxShadow = new Shadow(currentShadow.BlurRadius, shadowCutoutPolicy, new Color(currentColor.R, ShadowColorGreen.CurrentValue / 255.0f, currentColor.B, currentColor.A), currentShadow.Offset); }; ShadowColorBlue.ValueChanged += (o, e) => { @@ -191,7 +211,7 @@ namespace NUITizenGallery return; } Color currentColor = currentShadow.Color; - target.BoxShadow = new Shadow(currentShadow.BlurRadius, new Color(currentColor.R, currentColor.G, ShadowColorBlue.CurrentValue / 255.0f, currentColor.A), currentShadow.Offset); + target.BoxShadow = new Shadow(currentShadow.BlurRadius, shadowCutoutPolicy, new Color(currentColor.R, currentColor.G, ShadowColorBlue.CurrentValue / 255.0f, currentColor.A), currentShadow.Offset); }; ShadowOpacity.ValueChanged += (o, e) => { @@ -203,7 +223,7 @@ namespace NUITizenGallery return; } Color currentColor = currentShadow.Color; - target.BoxShadow = new Shadow(currentShadow.BlurRadius, new Color(currentColor.R, currentColor.G, currentColor.B, ShadowOpacity.CurrentValue / 255.0f), currentShadow.Offset); + target.BoxShadow = new Shadow(currentShadow.BlurRadius, shadowCutoutPolicy, new Color(currentColor.R, currentColor.G, currentColor.B, ShadowOpacity.CurrentValue / 255.0f), currentShadow.Offset); }; // Shadow Radius ShadowBlurRadius.ValueChanged += (o, e) => @@ -216,7 +236,7 @@ namespace NUITizenGallery return; } float currentRadius = ShadowBlurRadius.CurrentValue; - target.BoxShadow = new Shadow(currentRadius, currentShadow.Color, currentShadow.Offset); + target.BoxShadow = new Shadow(currentRadius, shadowCutoutPolicy, currentShadow.Color, currentShadow.Offset); }; } }