如何在UWP中创建一个讲话泡泡?
我正在创建一个聊天应用程序,并希望创建包含每条消息的典型语音气泡。 我在Blend中创建了一个Path对象(在XAML中),如下所示:
问题是路径设计为具有指定的宽度和高度,我希望它能够在不拉伸的情况下环绕文本 ,因此它不会像边框那样看起来变形。
我怎样才能让它表现得像我想要的那样?
您可以将Polygon
与StackPanel
结合使用:
看起来像这样:
编辑:
带边框的版本:
这可能不是最简单和最好的方法,也许Path
会更好地做到这一点,但它的工作原理:
这是一个Custom控件,它声明Text的Dependency属性,并在其模板(Background,Width,Heigth)中重用基本控件的一些属性。
首先是类定义:( SpeechBubbleControl.xaml.cs
)
[TemplatePart(Name = PartBubbleText, Type = typeof(TextBlock))] public sealed partial class SpeechBubbleControl : Control { private const string PartBubbleText = "BubbleText"; public static readonly DependencyProperty TextProperty = DependencyProperty.Register(nameof(Text), typeof(string), typeof(SpeechBubbleControl), new PropertyMetadata("")); public SpeechBubbleControl() { DefaultStyleKey = typeof(SpeechBubbleControl); } public string Text { get { return GetValue(TextProperty).ToString(); } set { SetValue(TextProperty, value); } } }
使用其默认模板( SpeechBubbleControl.xaml
):
您必须使用app.xaml
类似内容将此资源导入应用程序资源:
最后是一个示例测试页面,它使用此控件绑定宽度,高度(基于滑块)和必须显示的文本。
结果如下:
请注意,我的答案改编自这一点: WPF语音泡沫