1. 程式人生 > >【Win10】讓 TextBlock 按字符換行

【Win10】讓 TextBlock 按字符換行

none 應該 blog -c ref 內容 edi implement 建議

原文:【Win10】讓 TextBlock 按字符換行

要想將 TextBlock 裏的文本自動換行的話,只需要設置 TextWrapping 屬性為 Wrap 即可。

但是 TextWrapping 是盡可能根據空白字符來換行的,因此,就有可能出現下面這種狀況:

技術分享圖片

每一行的尾部會出現長短不一的空白。

在 UI 設計上,有一點建議,那就是同一級的內容是要對齊的。

而現在上面這種情況就有可能誤導用戶分成三段信息:

技術分享圖片

而且這樣的顯示,也不美觀。

因此,我們不禁想問,為什麽要按照空白字符來換行,而不是按字符來換行呢?

既然微軟沒有提供這個功能,那我們只能自己動手實現。

在字符當中,有一些特殊的字符,例如換行符、制表符這些的,當中有一個更為特殊的字符,叫做零寬空格:https://en.wikipedia.org/wiki/Zero-width_space

既然它是一個空格,那麽它肯定是可以對 TextWrapping 起作用的了。

那麽只需要在文本的每一個字符間插入這麽一個零寬字符的話,我們需要的效果就應該能實現了。

編寫一個 CharacterWrapConverter:

public class CharacterWrapConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, string language)
    {
        var str = (string
)value; return string.Join("\u200B", str.ToCharArray()); } public object ConvertBack(object value, Type targetType, object parameter, string language) { throw new NotImplementedException(); } }

效果:

技術分享圖片

那麽,現在你肯定會認為這段文本是一個整體,而不是像前面那樣看上去分成了三塊。而且看上去美觀多了。

【Win10】讓 TextBlock 按字符換行