こんにちは。
Xamarin.formsのBoxViewコントロールについて質問です。
BoxViewに角丸をつけたいのですが、
方法として、対象がiOSの場合
⑴ カスタムレンダラを使用して、iOSプラットフォームで記述する
⑵ Effects機能を使用して、iOSプラットフォームで記述する
を検討しています。
⑴の場合は、描画時にsharedプロジェクト側で指定した大きさにならず、
⑵の場合は、iOS側でBoxViewをUIViewとして受け取れず(Nullになる)、うまくいきません。
何かソリューションを持っている方いらっしゃいますか?
⑴のsharedプロジェクト側コード
namespace Test { public class MyBoxView : BoxView { public Color StrokeColor { get; set; } //ボーダ色 public Color FillColor { get; set; } //塗りつぶし色 public int LineWidth { get; set; } //ボーダの幅(0px~10px) public float Radius { get; set; } //角丸(0%~50%) public MyBoxView(Color fillColor, Color strokeColor, int lineWidth, float radius) { FillColor = fillColor; StrokeColor = strokeColor; LineWidth = lineWidth; Radius = radius; //デフォルト値でサイズとレイアウトを設定 WidthRequest = 100; HeightRequest = 100; HorizontalOptions = LayoutOptions.Center; VerticalOptions = LayoutOptions.Center; } } public class BoxViewTest : ContentPage { public BoxViewTest() { var layout = new AbsoluteLayout(); var myBox = new MyBoxView(Color.Gray, Color.Yellow, 1, 10); AbsoluteLayout.SetLayoutFlags(myBox, AbsoluteLayoutFlags.All); AbsoluteLayout.SetLayoutBounds(myBox, new Rectangle(0, 0.5, 1, 0.1)); layout.Children.Add(myBox); Padding = new Thickness(0, Device.OnPlatform(20, 0, 0), 0, 0); Content = layout; } } }
⑴のiOSプロジェクト側コード
//MyBoxViewのレンダラーをMyBoxViewRendererに変更する [assembly: ExportRenderer(typeof(MyBoxView), typeof(MyBoxViewRenderer))] namespace Test.iOS { public override void Draw(CGRect rect) { //デフォルトの描画を無効にする //base.Draw(rect); //モデルオブジェクトの取得 var myBoxView = (MyBoxView)Element; //Xamarin.Forms 1.0.6186 では、Modelでした using (var context = UIGraphics.GetCurrentContext()) { //塗りつぶしの色を指定 context.SetFillColor(myBoxView.FillColor.ToCGColor()); //ボーダの色を指定 context.SetStrokeColor(myBoxView.StrokeColor.ToCGColor()); //ボーダの幅を指定 context.SetLineWidth(myBoxView.LineWidth); //ボーダの分だけ四角のサイズを小さくする var rectangle = Bounds.Inset(myBoxView.LineWidth, myBoxView.LineWidth); //サイズ(幅)の半分を50%として、radiusを求める var radius = (float)((rectangle.Width / 2) * (myBoxView.Radius / 50)); //描画 var path = CGPath.FromRoundedRect(rectangle, radius, radius); context.AddPath(path); context.DrawPath(CGPathDrawingMode.FillStroke); } } }
⑵のsharedプロジェクト側コード
namespace Test { public class BoxViewTest : ContentPage { public BoxViewTest() { var layout = new AbsoluteLayout(); var box = new BoxView { BackgroundColor = Color.Blue }; AbsoluteLayout.SetLayoutFlags(box, AbsoluteLayoutFlags.All); AbsoluteLayout.SetLayoutBounds(box, new Rectangle(0.5, 0.5, 0.8, 0.5)); layout.Children.Add(box); box.Effects.Add(Effect.Resolve("Test.TestEffects")); Padding = new Thickness(0, Device.OnPlatform(20, 0, 0), 0, 0); Content = layout; } } }
⑵のiOSプロジェクト側コード
[assembly: ResolutionGroupName("Test")] [assembly: ExportEffect(typeof(TestEffects), "TestEffects")] namespace Test.iOS.Effects { public class TestEffects : PlatformEffect { protected override void OnAttached() { var box = Control; // ここでboxがnull if (box == null) { return; } box.Layer.BorderWidth = 10; box.Layer.BorderColor = UIColor.Black.CGColor; box.Layer.CornerRadius = 10; box.ClipsToBounds = true; } protected override void OnDetached() { } } }
以上、よろしくお願いします。
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2016/12/20 09:12
2016/12/22 01:15
2016/12/23 14:50
2016/12/26 00:41