Xamarin Forms:在文本中嵌入符号
Xamarin Forms: Embed symbols in text
我目前正在评估 Xamarin Forms,以替代我们针对移动平台的基于网络的 HTML 应用程序。
我们的应用程序经常使用嵌入在文本段落中的图形符号。
所需的效果如下所示:
当然文字也必须能够自由环绕,包括所有的符号。在HTML中可以这样简单地实现:
<p>Sample text with <img src="sample.jpg"> embedded</p>
如何使用 Xamarin Forms 达到同样的效果?我已经看过 FormattedStrings,它允许格式化标签的子段落,但是它们似乎不允许嵌入图像。
另请注意,该解决方案至少需要支持 iOS、Android 和 Windows Phone 8.1。
目前,在文本块中包含符号和图像的唯一方法是使用 WebView (https://developer.xamarin.com/guides/xamarin-forms/working-with/webview/)
var browser = new WebView();
var htmlSource = new HtmlWebViewSource ();
htmlSource.Html = @"<html><body>
<h1>Xamarin.Forms</h1>
<p>Welcome to WebView.</p>
</body></html>";
browser.Source = htmlSource;
显然被迫使用 WebView
几乎无法将 HTML5 应用程序移动到 Xamarin!
在 Xamarin 论坛中有人提出了类似的问题:https://forums.xamarin.com/discussion/1649/text-with-image
为了解决这个问题,Tomasz Cielecki 在此处编写了一些示例代码:https://gist.github.com/Cheesebaron/5034440
然后他在博客上写了这篇文章:
http://blog.ostebaronen.dk/2013/02/adding-images-to-textview-and-edittext.html
<截图>
I started out with a super simple sample trying to get an Image shown in a TextView. I googled up some solutions and sure, Spannables allow using ImageSpan inside of them! There were nice samples and such, and I came up with this.
TextView 中的 ImageSpan
//Load up your drawable.
var imageSpan = new ImageSpan(this, Resource.Drawable.Icon);
//Set the text of SpannableString from TextView
var spannableString = new SpannableString(textView.Text);
//Add image at end of string
spannableString.SetSpan(imageSpan, textView.Text.Length-1, textView.Text.Length, 0);
Easy, huh? And you can add loads of other Spans to the Spannable, such as StyleSpan, which you can style your fonts with bold, italic and other styles.
Since that was so easy, I quickly tried to do that with an EditText. It also works just fine...
我目前正在评估 Xamarin Forms,以替代我们针对移动平台的基于网络的 HTML 应用程序。
我们的应用程序经常使用嵌入在文本段落中的图形符号。 所需的效果如下所示:
当然文字也必须能够自由环绕,包括所有的符号。在HTML中可以这样简单地实现:
<p>Sample text with <img src="sample.jpg"> embedded</p>
如何使用 Xamarin Forms 达到同样的效果?我已经看过 FormattedStrings,它允许格式化标签的子段落,但是它们似乎不允许嵌入图像。
另请注意,该解决方案至少需要支持 iOS、Android 和 Windows Phone 8.1。
目前,在文本块中包含符号和图像的唯一方法是使用 WebView (https://developer.xamarin.com/guides/xamarin-forms/working-with/webview/)
var browser = new WebView();
var htmlSource = new HtmlWebViewSource ();
htmlSource.Html = @"<html><body>
<h1>Xamarin.Forms</h1>
<p>Welcome to WebView.</p>
</body></html>";
browser.Source = htmlSource;
显然被迫使用 WebView
几乎无法将 HTML5 应用程序移动到 Xamarin!
在 Xamarin 论坛中有人提出了类似的问题:https://forums.xamarin.com/discussion/1649/text-with-image
为了解决这个问题,Tomasz Cielecki 在此处编写了一些示例代码:https://gist.github.com/Cheesebaron/5034440
然后他在博客上写了这篇文章: http://blog.ostebaronen.dk/2013/02/adding-images-to-textview-and-edittext.html
<截图>
I started out with a super simple sample trying to get an Image shown in a TextView. I googled up some solutions and sure, Spannables allow using ImageSpan inside of them! There were nice samples and such, and I came up with this.
TextView 中的 ImageSpan
//Load up your drawable.
var imageSpan = new ImageSpan(this, Resource.Drawable.Icon);
//Set the text of SpannableString from TextView
var spannableString = new SpannableString(textView.Text);
//Add image at end of string
spannableString.SetSpan(imageSpan, textView.Text.Length-1, textView.Text.Length, 0);
Easy, huh? And you can add loads of other Spans to the Spannable, such as StyleSpan, which you can style your fonts with bold, italic and other styles.
Since that was so easy, I quickly tried to do that with an EditText. It also works just fine...