文本在WPF文本块垂直对齐

我如何分配垂直中心对齐到文本块内的文本?我发现TextAlignment属性,但它是水平文本对齐。我怎么做垂直文本对齐?

268916 次浏览

TextBlock不支持垂直文本对齐。

我通过用网格包装文本块并设置horizontalalign ="Stretch"和verticalalign ="Center"来解决这个问题。

是这样的:

<Grid>
<TextBlock
HorizontalAlignment="Stretch"
VerticalAlignment="Center"
Text="Your text" />
</Grid>

一个文本块本身不能做垂直对齐

最好的方法,这样做,我发现是把文本块内的边界,所以边界为您对齐。

<Border BorderBrush="{x:Null}" Height="50">
<TextBlock TextWrapping="Wrap" Text="Some Text" VerticalAlignment="Center"/>
</Border>

注意:这在功能上等同于使用网格,它只是取决于你想让控件如何与你的布局的其余部分相适应,以确定哪个更适合

对我来说,VerticalAlignment="Center"解决了这个问题 这可能是因为__abc0被包装在网格中,但实际上wpf中的所有内容都是如此

虽然Orion Edwards回答适用于任何情况,但每次你想这样做时,添加边界和设置边界的属性可能是一件痛苦的事情。另一个快速的方法是设置文本块的填充:

<TextBlock Height="22" Padding="3" />

你可以使用标签而不是文本块。

<Label Content="Hello, World!">
<Label.LayoutTransform>
<RotateTransform Angle="270"/>
</Label.LayoutTransform>
</Label>

我发现修改文本框样式(即:controltemplate),然后修改PART_ContentHost垂直对齐到居中就可以了

只是为了好玩,试试这个XAML吧。它不是完美的,因为它不是一个“对齐”,但它允许你调整一个段落中的文本对齐。

<TextBlock>
<TextBlock BaselineOffset="30">One</TextBlock>
<TextBlock BaselineOffset="20">Two</TextBlock>
<Run>Three</Run>
<Run BaselineAlignment="Subscript">Four</Run>
</TextBlock>

如果你可以忽略TextBlock的高度,你最好使用这个:

<TextBlock Height="{Binding}" Text="Your text"
TextWrapping="Wrap" VerticalAlignment="Center" Width="28"/>

在我的例子中,我这样做是为了使TextBlock更好地显示。

<Border BorderThickness="3" BorderBrush="Yellow" CornerRadius="10" Padding="2"
HorizontalAlignment="Center" VerticalAlignment="Center" Height="30" Width="150">
<TextBlock FontSize="20" Height="23" HorizontalAlignment="Left" Margin="0,0,0,-5" Text="" VerticalAlignment="Top" Width="141" Background="White" />
</Border>

使文本离底部更远的技巧是设置

Margin="0,0,0,-5"

我发现我必须做一些不同的事情。我的问题是,如果我改变字体大小,文本将在文本框中向上移动,而不是保持在底部与其余的文本框在一行。通过从上到下改变垂直对齐,我能够通过编程将字体大小从20更改为14 &后面,保持文字的重心在底部,保持东西整洁。方法如下:

enter image description here

垂直对齐的单行文本框。

为了扩展@Orion Edwards提供的答案,这是如何完全从代码背后(不设置样式)完成的。基本上创建一个自定义类,它继承自Border,它的Child设置为TextBox。下面的例子假设你只想要一行,并且border是Canvas的子元素。还假设您需要根据边界的宽度调整文本框的MaxLength属性。下面的例子还设置了边框的游标来模拟文本框,将其设置为“IBeam”类型。设置'3'的边距,这样文本框就不会完全对齐到边框的左侧。

double __dX = 20;
double __dY = 180;
double __dW = 500;
double __dH = 40;
int __iMaxLen = 100;


this.m_Z3r0_TextBox_Description = new CZ3r0_TextBox(__dX, __dY, __dW, __dH, __iMaxLen, TextAlignment.Left);
this.Children.Add(this.m_Z3r0_TextBox_Description);

类:

using System;
using System.Collections.Generic;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Shapes;
using System.Windows.Controls.Primitives;




namespace ifn0tz3r0Exp
{
class CZ3r0_TextBox : Border
{
private TextBox m_TextBox;


private SolidColorBrush m_Brush_Green = new SolidColorBrush(Colors.MediumSpringGreen);
private SolidColorBrush m_Brush_Black = new SolidColorBrush(Colors.Black);
private SolidColorBrush m_Brush_Transparent = new SolidColorBrush(Colors.Transparent);


public CZ3r0_TextBox(double _dX, double _dY, double _dW, double _dH, int _iMaxLen, TextAlignment _Align)
{


/////////////////////////////////////////////////////////////
//TEXTBOX
this.m_TextBox = new TextBox();
this.m_TextBox.Text = "This is a vertically centered one-line textbox embedded in a border...";
Canvas.SetLeft(this, _dX);
Canvas.SetTop(this, _dY);
this.m_TextBox.FontFamily = new FontFamily("Consolas");
this.m_TextBox.FontSize = 11;
this.m_TextBox.Background = this.m_Brush_Black;
this.m_TextBox.Foreground = this.m_Brush_Green;
this.m_TextBox.BorderBrush = this.m_Brush_Transparent;
this.m_TextBox.BorderThickness = new Thickness(0.0);
this.m_TextBox.Width = _dW;
this.m_TextBox.MaxLength = _iMaxLen;
this.m_TextBox.TextAlignment = _Align;
this.m_TextBox.VerticalAlignment = System.Windows.VerticalAlignment.Center;
this.m_TextBox.FocusVisualStyle = null;
this.m_TextBox.Margin = new Thickness(3.0);
this.m_TextBox.CaretBrush = this.m_Brush_Green;
this.m_TextBox.SelectionBrush = this.m_Brush_Green;
this.m_TextBox.SelectionOpacity = 0.3;


this.m_TextBox.GotFocus += this.CZ3r0_TextBox_GotFocus;
this.m_TextBox.LostFocus += this.CZ3r0_TextBox_LostFocus;
/////////////////////////////////////////////////////////////
//BORDER


this.BorderBrush = this.m_Brush_Transparent;
this.BorderThickness = new Thickness(1.0);
this.Background = this.m_Brush_Black;
this.Height = _dH;
this.Child = this.m_TextBox;
this.FocusVisualStyle = null;
this.MouseDown += this.CZ3r0_TextBox_MouseDown;
this.Cursor = Cursors.IBeam;
/////////////////////////////////////////////////////////////
}
private void CZ3r0_TextBox_MouseDown(object _Sender, MouseEventArgs e)
{
this.m_TextBox.Focus();
}
private void CZ3r0_TextBox_GotFocus(object _Sender, RoutedEventArgs e)
{
this.BorderBrush = this.m_Brush_Green;
}
private void CZ3r0_TextBox_LostFocus(object _Sender, RoutedEventArgs e)
{
this.BorderBrush = this.m_Brush_Transparent;
}
}
}

我认为最好是使用一个标签(或TextBlock)变成一个标签,你不能直接在边界控件中附加鼠标事件,最后它附加在TextBlock中,这是我的建议:

<Label
Height="32"
VerticalContentAlignment="Center"
HorizontalContentAlignment="Stretch"
MouseLeftButtonUp="MenuItem_MouseLeftButtonUp">
<TextBlock Padding="32 0 10 0">
Label with click event
</TextBlock>
</Label>

如果你可以没有文本包装,我认为用标签替换TextBlock是最简洁的方法来做到这一点。否则,从其他有效答案中选择一个。

<Label Content="Some Text" VerticalAlignment="Center"/>
  <TextBox AcceptsReturn="True"
TextWrapping="Wrap"
VerticalContentAlignment="Top" >
</TextBox>

TextBlock不支持其内容的垂直对齐。如果你必须使用TextBlock,那么你必须将它与它的父元素对齐。

然而,如果你可以使用Label代替(它们确实有非常相似的功能),那么你可以定位文本内容:

<Label VerticalContentAlignment="Center" HorizontalContentAlignment="Center">
I am centred text!
</Label>

默认情况下,Label将拉伸以填充其边界,这意味着标签的文本将居中。

我认为这是明智的使用一个没有边界和背景的文本框作为一个简单而快速的方式,以达到中心对齐的文本块

<TextBox
TextWrapping="Wrap"
HorizontalContentAlignment="Center"
VerticalContentAlignment="Center"
Background="{x:Null}"
BorderBrush="{x:Null}"
/>

实现你在这里谈论的内容的最好方法是创建一个支持VerticalContentAlignment的标签

然后,如果你确实需要一些Label没有涵盖的TextBlock属性,比如TextWrapping,你可以在你的Label中放置TextBlock

结果满足你的需求,VerticalContentAlignmentTextWrapping

<Label
VerticalContentAlignment="Center">
<TextBlock
TextWrapping="WrapWithOverflow">
My text goes here!
</TextBlock>
<Label/>