在Xamarin Forms iOS中为条目添加底部边框,最后添加图像

时间:2017-02-08 01:23:11

标签: xamarin xamarin.ios xamarin.forms

现在,在任何人忽略这个重复之前,请阅读到最后。我想要实现的是这个

What I want to achieve

我一直在做一些谷歌搜索,并在stackoverflow上查看目标c和快速响应。这种回应StackOverFlowPost似乎指向了正确的方向。作者甚至告诉我使用ClipsToBounds剪辑子视图并确保它在父节点范围内。现在这是我的问题,如果我想在条目的右侧显示图像(性别字段),我不能,因为我正在剪切子视图。

对于剪辑,我在所有文本框的父stacklayout中设置属性IsClippedToBounds =“True”。

这是我用来添加底部边框的代码

     Control.BorderStyle = UITextBorderStyle.None;
           var myBox = new UIView(new CGRect(0, 40, 1000, 1))
           {
               BackgroundColor = view.BorderColor.ToUIColor(),
           };
           Control.AddSubview(myBox);

这是我用来在条目的开头或结尾添加图片的代码

private void SetImage(ExtendedEntry view)
{
    if (!string.IsNullOrEmpty(view.ImageWithin))
    {
        UIImageView icon = new UIImageView
        {
            Image = UIImage.FromFile(view.ImageWithin),
            Frame = new CGRect(0, -12, view.ImageWidth, view.ImageHeight),
            ClipsToBounds = true
        };
        switch (view.ImagePos)
        {
            case ImagePosition.Left:                           
                Control.LeftView.AddSubview(icon);
                Control.LeftViewMode = UITextFieldViewMode.Always;
                break;
            case ImagePosition.Right:
                Control.RightView.AddSubview(icon);
                Control.RightViewMode = UITextFieldViewMode.Always;
                break;
        }

    }
}  

经过分析和调试,我发现当调用Custom Renderer的OnElementChanged函数时,仍然没有绘制控件,所以它没有大小。所以我将UITextField子类化为

 public class ExtendedUITextField : UITextField
    {
        public UIColor BorderColor;
        public bool HasBottomBorder;
        public override void Draw(CGRect rect)
        {
            base.Draw(rect);
            if (HasBottomBorder)
            {
                BorderStyle = UITextBorderStyle.None;
                var myBox = new UIView(new CGRect(0, 40, Frame.Size.Width, 1))
                {
                    BackgroundColor = BorderColor
                };
                AddSubview(myBox);
            }


        }

        public void InitInhertedProperties(UITextField baseClassInstance)
        {
            TextColor = baseClassInstance.TextColor;
        }

    }

并传递了像这样的hasbottomborder和bordercolor参数

protected override void OnElementChanged(ElementChangedEventArgs<Entry> e)
        {
            base.OnElementChanged(e);

            var view = e.NewElement as ExtendedEntry;


            if (view != null && Control != null)
            {
                if (view.HasBottomBorder)
                {
                    var native = new ExtendedUITextField
                    {
                        BorderColor = view.BorderColor.ToUIColor(),
                        HasBottomBorder = view.HasBottomBorder
                    };
                    native.InitInhertedProperties(Control);
                    SetNativeControl(native);
                }
}

但是这样做之后,现在没有事件发生火灾:( 有人可以指出我正确的方向。我已经为Android构建了这个,但iOS似乎给了我一个问题。

1 个答案:

答案 0 :(得分:1)

  

我发现当调用自定义渲染器的OnElementChanged函数时,仍然没有绘制控件,所以它没有大小。

在早期版本的Xamarin.Forms和iOS 9中,获取OnElementChanged内控件的大小......

您不需要ExtendedUITextField来获取控件的大小,覆盖原始渲染器中的Frame

public override CGRect Frame
{
    get
    {
        return base.Frame;
    }
    set
    {
        if (value.Width > 0 && value.Height > 0)
        {
            // Use the frame size now to update any of your subview/layer sizes, etc... 
        }
        base.Frame = value;
    }
}