Shadow in UIView cannot overlay Entry or Editor or Picker in Xamarin Forms
I added an RoutingEffect in Xamarin Form project and PlatformEffect in my Xamarin.iOS project. It will add effect to Stacklayout. The Stacklayout in this demo is a custom navigation bar. The below of navigation bar is a scrollview has many cells (label, entry, picker).
I implemented in Android is OK.
But in iOS has problem: Shadow effect cannot overlays some controls, such as: Entry, Editor, Picker. Could you share me how to fix it?
This is code in Xamarin.iOS project.
public class DropShadowEffect : PlatformEffect
{
protected override void OnAttached()
{
try
{
var effect = (myDemo.UIControls.DropShadowEffect)Element.Effects.FirstOrDefault(e => e is myDemo.UIControls.DropShadowEffect);
if (effect != null)
{
Container.Layer.CornerRadius = effect.Radius;
Container.Layer.ShadowColor = UIColor.Red.CGColor;// effect.Color.ToCGColor();
Container.Layer.ShadowOffset = new CGSize(effect.DistanceX, effect.DistanceY);
Container.Layer.ShadowOpacity = 0.8f;
Container.Layer.ShadowRadius = 2f;
Container.Layer.ShouldRasterize = true;
Container.Layer.MasksToBounds = false;
}
}
catch (Exception ex)
{
Console.WriteLine("Cannot set property on attached control. Error: {0}", ex.Message);
}
}
*Shadow effect overly Label is OK
*Shadow effect cannot overlay either Picker or Entry
ios xamarin.forms xamarin.ios effects dropshadow
asked Nov 22 '18 at 7:31
Tony PhamTony Pham
11119
add a comment |
I added an RoutingEffect in Xamarin Form project and PlatformEffect in my Xamarin.iOS project. It will add effect to Stacklayout. The Stacklayout in this demo is a custom navigation bar. The below of navigation bar is a scrollview has many cells (label, entry, picker).
I implemented in Android is OK.
But in iOS has problem: Shadow effect cannot overlays some controls, such as: Entry, Editor, Picker. Could you share me how to fix it?
This is code in Xamarin.iOS project.
public class DropShadowEffect : PlatformEffect
{
protected override void OnAttached()
{
try
{
var effect = (myDemo.UIControls.DropShadowEffect)Element.Effects.FirstOrDefault(e => e is myDemo.UIControls.DropShadowEffect);
if (effect != null)
{
Container.Layer.CornerRadius = effect.Radius;
Container.Layer.ShadowColor = UIColor.Red.CGColor;// effect.Color.ToCGColor();
Container.Layer.ShadowOffset = new CGSize(effect.DistanceX, effect.DistanceY);
Container.Layer.ShadowOpacity = 0.8f;
Container.Layer.ShadowRadius = 2f;
Container.Layer.ShouldRasterize = true;
Container.Layer.MasksToBounds = false;
}
}
catch (Exception ex)
{
Console.WriteLine("Cannot set property on attached control. Error: {0}", ex.Message);
}
}
*Shadow effect overly Label is OK
*Shadow effect cannot overlay either Picker or Entry
ios xamarin.forms xamarin.ios effects dropshadow
asked Nov 22 '18 at 7:31
Tony PhamTony Pham
11119
add a comment |
I added an RoutingEffect in Xamarin Form project and PlatformEffect in my Xamarin.iOS project. It will add effect to Stacklayout. The Stacklayout in this demo is a custom navigation bar. The below of navigation bar is a scrollview has many cells (label, entry, picker).
I implemented in Android is OK.
But in iOS has problem: Shadow effect cannot overlays some controls, such as: Entry, Editor, Picker. Could you share me how to fix it?
This is code in Xamarin.iOS project.
public class DropShadowEffect : PlatformEffect
{
protected override void OnAttached()
{
try
{
var effect = (myDemo.UIControls.DropShadowEffect)Element.Effects.FirstOrDefault(e => e is myDemo.UIControls.DropShadowEffect);
if (effect != null)
{
Container.Layer.CornerRadius = effect.Radius;
Container.Layer.ShadowColor = UIColor.Red.CGColor;// effect.Color.ToCGColor();
Container.Layer.ShadowOffset = new CGSize(effect.DistanceX, effect.DistanceY);
Container.Layer.ShadowOpacity = 0.8f;
Container.Layer.ShadowRadius = 2f;
Container.Layer.ShouldRasterize = true;
Container.Layer.MasksToBounds = false;
}
}
catch (Exception ex)
{
Console.WriteLine("Cannot set property on attached control. Error: {0}", ex.Message);
}
}
*Shadow effect overly Label is OK
*Shadow effect cannot overlay either Picker or Entry
ios xamarin.forms xamarin.ios effects dropshadow
asked Nov 22 '18 at 7:31
Tony PhamTony Pham
11119
I added an RoutingEffect in Xamarin Form project and PlatformEffect in my Xamarin.iOS project. It will add effect to Stacklayout. The Stacklayout in this demo is a custom navigation bar. The below of navigation bar is a scrollview has many cells (label, entry, picker).
I implemented in Android is OK.
But in iOS has problem: Shadow effect cannot overlays some controls, such as: Entry, Editor, Picker. Could you share me how to fix it?
This is code in Xamarin.iOS project.
public class DropShadowEffect : PlatformEffect
{
protected override void OnAttached()
{
try
{
var effect = (myDemo.UIControls.DropShadowEffect)Element.Effects.FirstOrDefault(e => e is myDemo.UIControls.DropShadowEffect);
if (effect != null)
{
Container.Layer.CornerRadius = effect.Radius;
Container.Layer.ShadowColor = UIColor.Red.CGColor;// effect.Color.ToCGColor();
Container.Layer.ShadowOffset = new CGSize(effect.DistanceX, effect.DistanceY);
Container.Layer.ShadowOpacity = 0.8f;
Container.Layer.ShadowRadius = 2f;
Container.Layer.ShouldRasterize = true;
Container.Layer.MasksToBounds = false;
}
}
catch (Exception ex)
{
Console.WriteLine("Cannot set property on attached control. Error: {0}", ex.Message);
}
}
*Shadow effect overly Label is OK
*Shadow effect cannot overlay either Picker or Entry
ios xamarin.forms xamarin.ios effects dropshadow
ios xamarin.forms xamarin.ios effects dropshadow
asked Nov 22 '18 at 7:31
Tony PhamTony Pham
11119
asked Nov 22 '18 at 7:31
Tony PhamTony Pham
11119
asked Nov 22 '18 at 7:31
Tony PhamTony Pham
11119
asked Nov 22 '18 at 7:31
Tony PhamTony Pham
11119
asked Nov 22 '18 at 7:31
Tony PhamTony Pham
11119
11119
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
Cause:
Actually, such as Label will still overlay the shadow.But it doesn't seem obvious.If you set the background of label (such as red ),you will see the overlay.
Solution:
You can set the BackgroundColor of the Picker and Entry in the custom renderer to let the alpha as 0.
For example in EntryRenderer
protected override void OnElementChanged(ElementChangedEventArgs<Entry> e)
{
base.OnElementChanged(e);
if (Control != null)
{
Control.BackgroundColor = new UIColor(1,1,1,0);//The last parameter sets the alpha of backgound as transparent
Control.Layer.MasksToBounds = true;
Control.Layer.CornerRadius = xxx; //set the rounded corner
Control.Layer.BorderColor = UIColor.xxx.CGColor;
Control.Layer.BorderWidth = xxx;
}
}
answered Nov 26 '18 at 4:42
Lucas Zhang - MSFTLucas Zhang - MSFT
1,916228
Thank you! I tried this solution, but I cannot set background color of either entry or picker. It is always transparent. Do you have any other solutions?
– Tony Pham
Nov 26 '18 at 10:01
Why you can not set it?
– Lucas Zhang - MSFT
Nov 26 '18 at 10:09
Because I set alpha 0 to BackgroundColor which is transparent. If I don't set alpha 0, problem about shadow is exist. private void SetBackgroundColor() { Control.BackgroundColor = new UIColor( (nfloat)FormElement.BackgroundColor.R, (nfloat)FormElement.BackgroundColor.G, (nfloat)FormElement.BackgroundColor.B, 0); }
– Tony Pham
Nov 26 '18 at 10:22
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53425885%2fshadow-in-uiview-cannot-overlay-entry-or-editor-or-picker-in-xamarin-forms%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
Cause:
Actually, such as Label will still overlay the shadow.But it doesn't seem obvious.If you set the background of label (such as red ),you will see the overlay.
Solution:
You can set the BackgroundColor of the Picker and Entry in the custom renderer to let the alpha as 0.
For example in EntryRenderer
protected override void OnElementChanged(ElementChangedEventArgs<Entry> e)
{
base.OnElementChanged(e);
if (Control != null)
{
Control.BackgroundColor = new UIColor(1,1,1,0);//The last parameter sets the alpha of backgound as transparent
Control.Layer.MasksToBounds = true;
Control.Layer.CornerRadius = xxx; //set the rounded corner
Control.Layer.BorderColor = UIColor.xxx.CGColor;
Control.Layer.BorderWidth = xxx;
}
}
answered Nov 26 '18 at 4:42
Lucas Zhang - MSFTLucas Zhang - MSFT
1,916228
Thank you! I tried this solution, but I cannot set background color of either entry or picker. It is always transparent. Do you have any other solutions?
– Tony Pham
Nov 26 '18 at 10:01
Why you can not set it?
– Lucas Zhang - MSFT
Nov 26 '18 at 10:09
Because I set alpha 0 to BackgroundColor which is transparent. If I don't set alpha 0, problem about shadow is exist. private void SetBackgroundColor() { Control.BackgroundColor = new UIColor( (nfloat)FormElement.BackgroundColor.R, (nfloat)FormElement.BackgroundColor.G, (nfloat)FormElement.BackgroundColor.B, 0); }
– Tony Pham
Nov 26 '18 at 10:22
add a comment |
Cause:
Actually, such as Label will still overlay the shadow.But it doesn't seem obvious.If you set the background of label (such as red ),you will see the overlay.
Solution:
You can set the BackgroundColor of the Picker and Entry in the custom renderer to let the alpha as 0.
For example in EntryRenderer
protected override void OnElementChanged(ElementChangedEventArgs<Entry> e)
{
base.OnElementChanged(e);
if (Control != null)
{
Control.BackgroundColor = new UIColor(1,1,1,0);//The last parameter sets the alpha of backgound as transparent
Control.Layer.MasksToBounds = true;
Control.Layer.CornerRadius = xxx; //set the rounded corner
Control.Layer.BorderColor = UIColor.xxx.CGColor;
Control.Layer.BorderWidth = xxx;
}
}
answered Nov 26 '18 at 4:42
Lucas Zhang - MSFTLucas Zhang - MSFT
1,916228
Thank you! I tried this solution, but I cannot set background color of either entry or picker. It is always transparent. Do you have any other solutions?
– Tony Pham
Nov 26 '18 at 10:01
Why you can not set it?
– Lucas Zhang - MSFT
Nov 26 '18 at 10:09
Because I set alpha 0 to BackgroundColor which is transparent. If I don't set alpha 0, problem about shadow is exist. private void SetBackgroundColor() { Control.BackgroundColor = new UIColor( (nfloat)FormElement.BackgroundColor.R, (nfloat)FormElement.BackgroundColor.G, (nfloat)FormElement.BackgroundColor.B, 0); }
– Tony Pham
Nov 26 '18 at 10:22
add a comment |
Cause:
Actually, such as Label will still overlay the shadow.But it doesn't seem obvious.If you set the background of label (such as red ),you will see the overlay.
Solution:
You can set the BackgroundColor of the Picker and Entry in the custom renderer to let the alpha as 0.
For example in EntryRenderer
protected override void OnElementChanged(ElementChangedEventArgs<Entry> e)
{
base.OnElementChanged(e);
if (Control != null)
{
Control.BackgroundColor = new UIColor(1,1,1,0);//The last parameter sets the alpha of backgound as transparent
Control.Layer.MasksToBounds = true;
Control.Layer.CornerRadius = xxx; //set the rounded corner
Control.Layer.BorderColor = UIColor.xxx.CGColor;
Control.Layer.BorderWidth = xxx;
}
}
answered Nov 26 '18 at 4:42
Lucas Zhang - MSFTLucas Zhang - MSFT
1,916228
Cause:
Actually, such as Label will still overlay the shadow.But it doesn't seem obvious.If you set the background of label (such as red ),you will see the overlay.
Solution:
You can set the BackgroundColor of the Picker and Entry in the custom renderer to let the alpha as 0.
For example in EntryRenderer
protected override void OnElementChanged(ElementChangedEventArgs<Entry> e)
{
base.OnElementChanged(e);
if (Control != null)
{
Control.BackgroundColor = new UIColor(1,1,1,0);//The last parameter sets the alpha of backgound as transparent
Control.Layer.MasksToBounds = true;
Control.Layer.CornerRadius = xxx; //set the rounded corner
Control.Layer.BorderColor = UIColor.xxx.CGColor;
Control.Layer.BorderWidth = xxx;
}
}
answered Nov 26 '18 at 4:42
Lucas Zhang - MSFTLucas Zhang - MSFT
1,916228
answered Nov 26 '18 at 4:42
Lucas Zhang - MSFTLucas Zhang - MSFT
1,916228
answered Nov 26 '18 at 4:42
Lucas Zhang - MSFTLucas Zhang - MSFT
1,916228
answered Nov 26 '18 at 4:42
Lucas Zhang - MSFTLucas Zhang - MSFT
1,916228
1,916228
Thank you! I tried this solution, but I cannot set background color of either entry or picker. It is always transparent. Do you have any other solutions?
– Tony Pham
Nov 26 '18 at 10:01
Why you can not set it?
– Lucas Zhang - MSFT
Nov 26 '18 at 10:09
Because I set alpha 0 to BackgroundColor which is transparent. If I don't set alpha 0, problem about shadow is exist. private void SetBackgroundColor() { Control.BackgroundColor = new UIColor( (nfloat)FormElement.BackgroundColor.R, (nfloat)FormElement.BackgroundColor.G, (nfloat)FormElement.BackgroundColor.B, 0); }
– Tony Pham
Nov 26 '18 at 10:22
add a comment |
Thank you! I tried this solution, but I cannot set background color of either entry or picker. It is always transparent. Do you have any other solutions?
– Tony Pham
Nov 26 '18 at 10:01
Why you can not set it?
– Lucas Zhang - MSFT
Nov 26 '18 at 10:09
Because I set alpha 0 to BackgroundColor which is transparent. If I don't set alpha 0, problem about shadow is exist. private void SetBackgroundColor() { Control.BackgroundColor = new UIColor( (nfloat)FormElement.BackgroundColor.R, (nfloat)FormElement.BackgroundColor.G, (nfloat)FormElement.BackgroundColor.B, 0); }
– Tony Pham
Nov 26 '18 at 10:22
Thank you! I tried this solution, but I cannot set background color of either entry or picker. It is always transparent. Do you have any other solutions?
– Tony Pham
Nov 26 '18 at 10:01
Thank you! I tried this solution, but I cannot set background color of either entry or picker. It is always transparent. Do you have any other solutions?
– Tony Pham
Nov 26 '18 at 10:01
Why you can not set it?
– Lucas Zhang - MSFT
Nov 26 '18 at 10:09
Why you can not set it?
– Lucas Zhang - MSFT
Nov 26 '18 at 10:09
Because I set alpha 0 to BackgroundColor which is transparent. If I don't set alpha 0, problem about shadow is exist. private void SetBackgroundColor() { Control.BackgroundColor = new UIColor( (nfloat)FormElement.BackgroundColor.R, (nfloat)FormElement.BackgroundColor.G, (nfloat)FormElement.BackgroundColor.B, 0); }
– Tony Pham
Nov 26 '18 at 10:22
Because I set alpha 0 to BackgroundColor which is transparent. If I don't set alpha 0, problem about shadow is exist. private void SetBackgroundColor() { Control.BackgroundColor = new UIColor( (nfloat)FormElement.BackgroundColor.R, (nfloat)FormElement.BackgroundColor.G, (nfloat)FormElement.BackgroundColor.B, 0); }
– Tony Pham
Nov 26 '18 at 10:22
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53425885%2fshadow-in-uiview-cannot-overlay-entry-or-editor-or-picker-in-xamarin-forms%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
