Wpf 텍스트 블록의 수직 텍스트

Wpf 텍스트 블록의 수직 텍스트

모든 문자가 (레이아웃 변환으로 회전하지 않고) 서로 겹쳐지도록 텍스트 블록에 텍스트를 수직으로 표시할 수 있습니까?

아무도 순수 XAML을 사용하여 임의 문자열의 문자를 수직으로 (회전시키지 않고) 쌓는 명백하고 사소한 방법에 대해 언급하지 않았습니다.

<ItemsControl
  ItemsSource="Text goes here, or you could use a binding to a string" />

이렇게 하면 문자열이 IE 숫자라는 사실을 인식하여 텍스트를 세로로 배치하기 때문에 ItemsControl은 문자열의 각 문자를 별도의 항목으로 처리할 수 있습니다.ItemsControl의 기본 패널은 스택 패널이므로 문자는 수직으로 배치됩니다.

참고: 수평 배치, 수직 간격 등을 정확하게 제어하기 위해 ItemControl에서 ItemContainerStyle 및 ItemTemplate 속성을 설정할 수 있습니다.

혹시라도 이 게시물을 발견하는 사람이 있을지도 모르니까요...여기 간단한 100% xaml 용액이 있습니다.

    <TabControl TabStripPlacement="Left">
        <TabItem Header="Tab 1">
            <TabItem.LayoutTransform>
                <RotateTransform Angle="-90"></RotateTransform>      
            </TabItem.LayoutTransform>
            <TextBlock> Some Text for tab 1</TextBlock>
        </TabItem>
        <TabItem Header="Tab 2">
            <TabItem.LayoutTransform>
                <RotateTransform Angle="-90"></RotateTransform>
            </TabItem.LayoutTransform>
            <TextBlock> Some Text for tab 2</TextBlock>
        </TabItem>
    </TabControl>

저는 시스템이 본질적으로 텍스트를 배치하는 방식을 바꾸지 않고 이것을 하는 것은 간단하지 않다고 생각합니다.가장 쉬운 해결책은 텍스트 블록의 너비를 변경하고 다음과 같은 몇 가지 추가 속성을 제공하는 것입니다.

<TextBlock TextAlignment="Center" FontSize="14" FontWeight="Bold" Width="10" TextWrapping="Wrap">THIS IS A TEST</TextBlock>

이것은 구식이지만, 효과가 있습니다.

단순한 레이아웃 변환을 사용하면 됩니다.

<Label Grid.Column="0" Content="Your Text Here" HorizontalContentAlignment="Center">
  <Label.LayoutTransform>
    <TransformGroup>
        <RotateTransform Angle="90" />
        <ScaleTransform ScaleX="-1" ScaleY="-1"/>
    </TransformGroup>
  </Label.LayoutTransform>
</Label>

실행 가능:

당신의.TextBlock의TextAlignment는 속을다로설합니야다해정으로 .Center:

<TextBlock Name="textBlock1" TextAlignment="Center" Text="Stacked!" />

그 다음 추가NewLine모든 문자 사이의 s:

textBlock1.Text =
    String.Join(
        Environment.NewLine,
        textBlock1.Text.Select(c => new String(c, 1)).ToArray());

(사用)System.Linq원본 문자열의 개별 문자에서 문자열 배열을 만듭니다.다른 방법이 있을 거라고 확신해요...)

아래의 XAML 코드는 텍스트 블록에 표시되는 텍스트의 각도를 변경합니다.

<TextBlock Height="14"
        x:Name="TextBlock1"
        Text="Vertical Bottom to Up" Margin="73,0,115,0" RenderTransformOrigin="0.5,0.5" >
        <TextBlock.RenderTransform>
            <TransformGroup>
                <ScaleTransform/>
                <SkewTransform/>
                <RotateTransform Angle="-90"/>
                <TranslateTransform/>
            </TransformGroup>
        </TextBlock.RenderTransform>
 </TextBlock>

Ray Burns가 제안한 수락된 답변은 .net 4.0에서 저에게 적용되지 않습니다.제가 한 방법은 다음과 같습니다.

mscorlib를 끌어 들입니다.

xmlns:s="clr-namespace:System;assembly=mscorlib"

사용자 제어/다운로드/페이지 리소스를 입력합니다.

<s:String x:Key="SortString">Sort</s:String>

그리고 이것을 이렇게 사용합니다.

<ItemsControl ItemsSource="{Binding Source={StaticResource SortString}}" Margin="5,-1,0,0"   />    

도움이 되길 바랍니다!

한 문자를 사용하는 여러 텍스트 블록으로 스택 패널 만들기

텍스트 컨테이너의 최대 너비를 문자 하나만 허용하도록 만들고 텍스트를 감쌉니다.

<TextBlock TextWrapping="Wrap" MaxWidth="8" TextAlignment="Center" Text="stack" />

이미지를 만들고 블록을 이미지로 채우고, 코드를 만지작거리는 대신 포토샵이나 텍스트를 조작하도록 설계된 무언가를 사용합니까?

이 코드를 사용하면 수직 텍스트 스태킹과 수평 중심 문자를 사용할 수 있습니다.

<ItemsControl Grid.Row="1"
              Grid.Column="0"
              ItemsSource="YOUR TEXT HERE"
              HorizontalAlignment="Center"
              VerticalAlignment="Center">

    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <TextBlock Text="{Binding}"
                   HorizontalAlignment="Center"/>
        </DataTemplate>
    </ItemsControl.ItemTemplate>

</ItemsControl>

텍스트 블록의 모든 문자 뒤에 '\n'을 삽입하여 수직으로 표시하는 방법은 다음과 같습니다.

<TextBlock x:Name="VertTextBlock" Text="Vertical Text" Loaded="VertTextBlock_Loaded"></TextBlock>

그런 다음 로드된 이벤트 핸들러에서 다음과 같이 말합니다.

TextBlock tb = sender as TextBlock;
StringBuilder sb = new StringBuilder(tb.Text);
int len = tb.Text.Length * 2;

for (int i = 1; i < len; i += 2)
{
    sb.Insert(i, '\n');
}

tb.Text = sb.ToString();

이 솔루션은 Lette가 제안했지만, 저는 제 구현으로 인해 간접비가 적게 발생한다고 생각합니다.

<linebreak/> can be used to show data in two lines

"RUN" 바인딩을 사용할 수도 있습니다.

App.xaml 파일에서 다음과 같은 것을 사용합니다.

<Application x:Class="Some.App"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:commands="clr-namespace:Deridiam.Helper.Commands"
         xmlns:i="http://schemas.microsoft.com/xaml/behaviors"
         ShutdownMode="OnMainWindowClose"
         StartupUri="Views/MainWindow.xaml">
<Application.Resources>

    <commands:HorizontalToVertical x:Key="HorizontalToVertical_Command"></commands:HorizontalToVertical>

    <ControlTemplate x:Key="VerticalCell" TargetType="ContentControl">
            <TextBlock Text="{TemplateBinding Content}" Foreground="Black"
                    TextAlignment="Center" FontWeight="Bold" VerticalAlignment="Center"
                    TextWrapping="Wrap" Margin="0" FontSize="10">  
                <i:Interaction.Triggers>
                    <i:EventTrigger EventName="Loaded">
                        <i:InvokeCommandAction Command="{Binding ConvertToVerticalCmd, Source={StaticResource HorizontalToVertical_Command}}" 
                                               CommandParameter="{Binding RelativeSource={RelativeSource AncestorType={x:Type TextBlock}}}" />
                    </i:EventTrigger>
                </i:Interaction.Triggers>
            </TextBlock>
    </ControlTemplate>

</Application.Resources>

i:를 사용하여 텍스트 블록에 바인딩된 명령 클래스를 만듭니다.상호 작용.app.xaml 예제의 Loaded 이벤트에 트리거합니다.

namespace Deridiam.Helper.Commands
{
public class HorizontalToVertical
{
    private ICommand _convertToVerticalCommand;

    public ICommand ConvertToVerticalCmd =>
        _convertToVerticalCommand ?? (_convertToVerticalCommand = new RelayCommand(
                x =>
                {
                    var tBlock = x as TextBlock;
                    var horizontalText = tBlock.Text;
                    tBlock.Text = "";

                    horizontalText.Select(c => c).ToList().ForEach(c =>
                    {
                        if (c.ToString() == " ")
                        {
                            tBlock.Inlines.Add("\n");
                            //tBlock.Inlines.Add("\n");
                        }

                        else
                        {
                            tBlock.Inlines.Add((new Run(c.ToString())));
                            tBlock.Inlines.Add(new LineBreak());
                        }


                    });
                }));
}
}

마지막으로 세로 텍스트를 표시할 .xaml 파일에서

<ContentControl Width="15" Content="Vertical Text" Template="{StaticResource VerticalCell}">
</ContentControl>

결과:

V
e
r
t
i
c
a
l

T
e
x
t

위의 솔루션 중 어떤 것도 제 문제를 해결하지 못했습니다(일부는 근접). 그래서 저는 제 솔루션을 게시하고 누군가를 도우러 왔습니다.수락된 솔루션이 도움이 되었지만 텍스트가 중앙에 정렬되어 있지 않습니다.

<ItemsControl ItemsSource="{Binding SomeStringProperty, FallbackValue=Group 1}" Margin="5"
          TextElement.FontSize="16" 
          TextElement.FontWeight="Bold" 
          TextBlock.TextAlignment="Center"
          HorizontalAlignment="Center" 
          VerticalAlignment="Center" >
<ItemsControl.ItemsPanel>
    <ItemsPanelTemplate>
        <WrapPanel Orientation="Vertical" />
    </ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
    <DataTemplate  >
        <TextBlock Text="{Binding }" HorizontalAlignment="Center"  />
    </DataTemplate>
</ItemsControl.ItemTemplate>

변환기를 기반으로 한 솔루션을 제공합니다.

using System;
using System.Collections.Generic;
using System.Globalization;
using System.Windows.Data;
using System.Windows.Markup;

namespace Converters
{
    [ValueConversion(typeof(object), typeof(string))]
    public class InsertLineBreakConverter : IValueConverter
    {
        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
        {
            if (parameter != null)
                value = parameter;

            if (value == null)
                return null;

            if (!(value is string str))
                str = value.ToString();

            return string.Join(Environment.NewLine, (IEnumerable<char>) str);
        }

        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
        {
            throw new NotImplementedException();
        }

        public static InsertLineBreakConverter Instance { get; } = new InsertLineBreakConverter();
    }

    public class InsertLineBreakConverterExtension : MarkupExtension
    {
        public override object ProvideValue(IServiceProvider serviceProvider)
            => InsertLineBreakConverter.Instance;
    }
}

사용 예:

   <TextBlock Text="{Binding Property, Converter={cnvs:InsertLineBreakConverter}}"/>   
   <TextBlock Text="{Binding Converter={cnvs:InsertLineBreakConverter}, ConverterParameter='Some Text'}"/>

언급URL : https://stackoverflow.com/questions/349875/vertical-text-in-wpf-textblock