在IOS xamarin中创建与whatsapp等图片的设计聊天

Question

如何像whatsapp（ios xamarin）创建设计聊天。 如下图所示：

我的代码：

ContentView.AddConstraints(NSLayoutConstraint.FromVisualFormat("H:|[bubble]",
            0,"bubble", BubbleImageView));
            ContentView.AddConstraints(NSLayoutConstraint.FromVisualFormat("V:|-2-[bubble]-2-|",0,"bubble", BubbleImageView
            ));
            BubbleImageView.AddConstraints(NSLayoutConstraint.FromVisualFormat("H:[bubble(>=48)]",0,"bubble", BubbleImageView));

//setting layout for Image Picture

var vSpaceTopAttch = NSLayoutConstraint.Create(ImgPicture, NSLayoutAttribute.Top, NSLayoutRelation.Equal, BubbleImageView, NSLayoutAttribute.Top, 1, 10);
                ContentView.AddConstraint(vSpaceTopAttch);

//setting layout for Message Label

var vSpaceTop = NSLayoutConstraint.Create(MessageLabel, NSLayoutAttribute.Top, NSLayoutRelation.Equal, BubbleImageView, NSLayoutAttribute.Top, 1, 10);
                ContentView.AddConstraint(vSpaceTop);

var vSpaceBottom = NSLayoutConstraint.Create(MessageLabel, NSLayoutAttribute.Bottom, NSLayoutRelation.Equal, BubbleImageView, NSLayoutAttribute.Bottom, 1, -10);
            ContentView.AddConstraint(vSpaceBottom);

var msgLeading = NSLayoutConstraint.Create(MessageLabel, NSLayoutAttribute.Leading, NSLayoutRelation.GreaterThanOrEqual, BubbleImageView, NSLayoutAttribute.Leading, 1, 16);
            ContentView.AddConstraint(msgLeading);

var msgCenter = NSLayoutConstraint.Create(MessageLabel, NSLayoutAttribute.CenterX, NSLayoutRelation.Equal, BubbleImageView, NSLayoutAttribute.CenterX, 1, 3);
            ContentView.AddConstraint(msgCenter);

此代码的结果：

位置图像位于BubbleImageView后面。 如何在ios xamarin中设计类似whatsapp的布局？

Answer 1

您是否尝试将带有图像的子视图带到前面：

ContentView.BringSubviewToFront(yourImageSubView);