Выровнять нижнюю часть текста в элементах управления

Не существует единственного решения XAML, вам нужно использовать код. Кроме того, даже с выделенным кодом для этого нет общего решения, потому что что, если ваш текст многострочный? Какую базовую линию следует использовать в этом случае? Или что, если в вашем шаблоне несколько текстовых элементов? Например, заголовок и контент или что-то еще, какая тогда базовая линия?

Короче говоря, лучше всего выровнять текст вручную, используя верхнее / нижнее поля.

Если вы готовы сделать предположение, что у вас есть единственный текстовый элемент, вы можете определить расстояние в пикселях от базовой линии от верха элемента, создав экземпляр объекта FormattedText со всеми теми же свойствами существующего текстового элемента. У объекта FormattedText есть свойство double Baseline, которое содержит это значение. Обратите внимание, что вам все равно придется вручную вводить поля, потому что элемент может не располагаться точно напротив верха или низа своего контейнера.

См. Это сообщение на форуме MSDN: Textbox Baseline < / а>

public double CalculateBaseline(object textObject)
{
    double r = double.NaN;
    if (textObject == null) return r;

    Type t = textObject.GetType();
    BindingFlags bindingFlags = BindingFlags.Instance | BindingFlags.Public;

    var fontSizeFI = t.GetProperty("FontSize", bindingFlags);
    if (fontSizeFI == null) return r;
    var fontFamilyFI = t.GetProperty("FontFamily", bindingFlags);
    var fontStyleFI = t.GetProperty("FontStyle", bindingFlags);
    var fontWeightFI = t.GetProperty("FontWeight", bindingFlags);
    var fontStretchFI = t.GetProperty("FontStretch", bindingFlags);

    var fontSize = (double)fontSizeFI.GetValue(textObject, null);
    var fontFamily = (FontFamily)fontFamilyFI.GetValue(textObject, null);
    var fontStyle = (FontStyle)fontStyleFI.GetValue(textObject, null);
    var fontWeight = (FontWeight)fontWeightFI.GetValue(textObject, null);
    var fontStretch = (FontStretch)fontStretchFI.GetValue(textObject, null);

    var typeFace = new Typeface(fontFamily, fontStyle, fontWeight, fontStretch);

    var formattedText = new FormattedText(
        "W", 
        CultureInfo.CurrentCulture, 
        FlowDirection.LeftToRight, 
        typeFace, 
        fontSize, 
        Brushes.Black);

    r = formattedText.Baseline;

    return r;
}

<StackPanel>
    <StackPanel.Resources>
        <Style TargetType="TextBlock">
            <Setter Property="Margin" Value="0,40,0,0"/>
        </Style>
    </StackPanel.Resources>
    <StackPanel Orientation="Horizontal">
        <TextBlock Name="tb1" Text="Lorem " FontSize="10"/>
        <TextBlock Name="tbref" Text="ipsum"/>
    </StackPanel>
    <StackPanel Orientation="Horizontal">
        <TextBlock Name="tb2" Text="dolor "  FontSize="20"/>
        <TextBlock Text="sit"/>
    </StackPanel>
    <StackPanel Orientation="Horizontal">
        <TextBlock Name="tb3" Text="amet "  FontSize="30"/>
        <TextBlock Text="consectetuer"/>
    </StackPanel>
</StackPanel>

double baseRef = CalculateBaseline(tbref);
double base1 = CalculateBaseline(tb1) - baseRef;
double base2 = CalculateBaseline(tb2) - baseRef;
double base3 = CalculateBaseline(tb3) - baseRef;
tb1.Margin = new Thickness(0, 40 - base1, 0, 0);
tb2.Margin = new Thickness(0, 40 - base2, 0, 0);
tb3.Margin = new Thickness(0, 40 - base3, 0, 0);

Еще одно довольно простое решение:

1) Используйте элементы управления TextBlock вместо меток. Причина в том, что TextBlock легче, чем Label - см. http://joshsmithonwpf.wordpress.com/2007/07/04/differences-between-label-and-textblock/

2) Используйте LineHeight и LineStackingStrategy = BlockLineHeight для своего стиля TextBlock. Это легко выровняет два по их базовой линии.

<StackPanel Orientation="Horizontal"
            VerticalAlignment="Center"
            HorizontalAlignment="Center">
    <StackPanel.Resources>
        <Style TargetType="TextBlock">
            <Setter Property="LineHeight" Value="44pt"/>
            <Setter Property="LineStackingStrategy" Value="BlockLineHeight"/>
        </Style>
    </StackPanel.Resources>            
    <TextBlock Text="Name:"/>
    <TextBlock Text="Itzhak Perlman" FontSize="44"/>
</StackPanel>

Мне очень нравятся креативные решения, представленные здесь, но я думаю, что в конечном итоге (подразумевается игра слов) мы должны использовать следующее:

<TextBlock>
   <Run FontSize="20">What</Run>
   <Run FontSize="36">ever</Run>
   <Run FontSize="12" FontWeight="Bold">FontSize</Run>
</TextBlock>

Единственное, что отсутствует в элементе Run, - это привязка данных свойства Text, но это может быть добавлено рано или поздно.

Выполнение не исправит выравнивание меток и их текстовых полей, но для многих простых ситуаций Run подойдет довольно хорошо.

<TextBlock>
<InlineUIContainer BaselineAlignment="Baseline"><TextBlock>Small</TextBlock></InlineUIContainer>
<InlineUIContainer BaselineAlignment="Baseline"><TextBlock FontSize="50">Big</TextBlock></InlineUIContainer>
</TextBlock>

Это должно сработать. Поэкспериментируйте с Baseline / Bottom / Center / Top.

Конструктор XAML поддерживает выравнивание TextBlock элементов управления по базовому уровню во время разработки:

Это назначает фиксированные поля вашим элементам управления. Пока размеры шрифта не изменяются во время выполнения, выравнивание сохраняется.

Я действительно нашел простой ответ, основанный на Aviad.

Я создал конвертер, содержащий функцию Aviad, которая принимает сам элемент и возвращает вычисленную толщину.

Затем я настроил

<Style TargetType="TextBlock">
    <Setter Property="Margin" 
        Value="{Binding RelativeSource={RelativeSource Self}, Converter={StaticResource converters:TextAlignmentMarginConverter}}" />
</Style>

Недостатком является то, что это, очевидно, занимает исходное свойство Margin, поскольку TextBlock не имеет шаблона, поэтому мы не можем установить его через TemplateBinding.

В статье блога XAML улучшения текста в Windows 8.1 объясняется, как вы можете выровнять два TextBlock шрифта разного размера по их базовой линии. Уловка TextLineBounds="TrimToBaseline" в сочетании с VerticalAlignment="Bottom". Это удаляет размер ниже их базовой линии, а затем перемещает TextBlocks вниз. Затем вы можете переместить их обратно на желаемую высоту, установив Margin на контейнере, в который вы их поместили.

Образец:

<Grid Margin="some margin to lift the TextBlocks to desired height">
    <TextBlock Text="{x:Bind ViewModel.Name, Mode=OneWay}"
                Style="{StaticResource HeaderTextBlockStyle}"
                VerticalAlignment="Bottom"
                TextLineBounds="TrimToBaseline" />
    <TextBlock Text="{x:Bind ViewModel.Description.Yield, Mode=OneWay}"
                Style="{StaticResource SubheaderTextBlockStyle}"
                VerticalAlignment="Bottom"
                HorizontalAlignment="Right"
                TextLineBounds="TrimToBaseline" />
</Grid>