0

自動スクロール テキストブロックを作成しようとしています。

これは私がこれまでに持っているコードです:

<Window x:Class="WpfApplication1.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="150" Width="400">
<Grid HorizontalAlignment="Stretch">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="50"></ColumnDefinition>
        <ColumnDefinition Width="*"></ColumnDefinition>
        <ColumnDefinition Width="50"></ColumnDefinition>
    </Grid.ColumnDefinitions>

    <StackPanel Background="Red" Grid.Column="0" />

    <StackPanel x:Name="UserContainer" Grid.Column="1">
        <TextBlock x:Name="UserStatusLabel" TextWrapping="NoWrap" VerticalAlignment="Top"><Run Language="nl-nl" Text="Neque porro quisquam est qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit."/>
        <TextBlock.RenderTransform>
          <TranslateTransform x:Name="translate" />
            </TextBlock.RenderTransform>
              <TextBlock.Triggers>
                <EventTrigger RoutedEvent="FrameworkElement.Loaded">
                    <BeginStoryboard>
                        <Storyboard RepeatBehavior="Forever">
                            <DoubleAnimation
                                From="{Binding ElementName=UserContainer, Path=Width}" To="-200"
                                Storyboard.TargetName="translate"
                                Storyboard.TargetProperty="X"
                                Duration="0:0:3"
                                AutoReverse="True" />
                        </Storyboard>
                    </BeginStoryboard>
                </EventTrigger>
            </TextBlock.Triggers>
        </TextBlock>
    </StackPanel>
    <StackPanel Background="Blue" Grid.Column="2" />
</Grid>

しかし、私には3つの問題があります:

  • テキストは最後まで左にスクロールする必要があります。現在、特定のポイントで停止しています
  • テキストは左側の赤いコンテナを横切ったり、横切ったりしてはなりません。
  • 途中で文字が途切れるのですが、原因がわかりません。
4

2 に答える 2

1

問題は、Render Transform を使用すると、レンダリングされたものだけを変換していて、その時点でテキストがカットされていることです。LayoutTransform は TranslateTransform を無視するため、ここでは使用できませんが、RotateTransform を使用している場合は、残りのテキストが表示されます。Render Transform でどのように目標を達成できるかわかりません。

            <TextBlock.LayoutTransform>
                <RotateTransform  x:Name="translate" />
            </TextBlock.LayoutTransform>
            <TextBlock.Triggers>
                <EventTrigger RoutedEvent="FrameworkElement.Loaded">
                    <BeginStoryboard>
                        <Storyboard RepeatBehavior="Forever">
                            <DoubleAnimation
                            From="0" To="90"
                            Storyboard.TargetName="translate"
                            Storyboard.TargetProperty="Angle"
                            Duration="0:0:3"
                            AutoReverse="True" />
                        </Storyboard>
                    </BeginStoryboard>
                </EventTrigger>
            </TextBlock.Triggers>

編集：マージンアニメーションについてはどうですか、うまくいきます：

<ThicknessAnimation
     Storyboard.TargetName="UserStatusLabel"
     Storyboard.TargetProperty="Margin"
     Duration="0:0:3" AutoReverse="True"  From="0,0,0,0" To="-200,0,0,0" />
于 2013-09-10T11:02:38.633 に答える
1

ClipToBounds="True"まず、中央に追加してStackPanel、テキストが の境界を離れた後に表示されないようにする必要がありますStackPanel。

第二に、あなたが言うように、テキストは「特定の距離」で停止しDoubleAnimationます-200。StackPanel.ActualWidthこれをプロパティの実際の値に置き換える必要があります。

<DoubleAnimation To="{Binding ActualWidth, ElementName=UserContainer}" 
    Storyboard.TargetName="translate" Storyboard.TargetProperty="X" Duration="0:0:3" 
    AutoReverse="True" />

ただし、これは代わりにテキストを右端に移動します。今のところ、これを回答として提供します。動きの方向を逆にする簡単な方法を思いつくことができれば、後で戻って編集します。

UPADTE >>>

わかりましたので、テキストを左に移動させる最も簡単な方法は、単純な を実装することConverterです:

public class AdditiveInverseDoubleConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        if (value == null || value.GetType() != typeof(double) && targetType != typeof(double)) return false;
        return -(double)value;
    }

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
    {
        if (value == null || value.GetType() != typeof(double) && targetType != typeof(double)) return false;
        return -(double)value;
    }
}

次に、XAML を変更します。

<DoubleAnimation To="{Binding ActualWidth, ElementName=UserContainer, Converter={
    StaticResource AdditiveInverseDoubleConverter}}" Storyboard.TargetName="translate" 
    Storyboard.TargetProperty="X" Duration="0:0:3" AutoReverse="True" />

XML 名前空間を追加することを忘れないでください。

xmlns:Converters="clr-namespace:WpfApplication1.Converters"

そしてResource：

<Window.Resources>
    <Converters:AdditiveInverseDoubleConverter x:Key="AdditiveInverseDoubleConverter" />
</Window.Resources>

更新 2 >>>

ああ、私はそれを解決しました...それ以外の場合TextBlockは収まらないため、切り取られていStackPanelます...StackPanel大きくすると、より多くのテキストが表示されます。ただし、答えは、を使用せず、代わりにStackPanela を使用するCanvasことです...これにより、すべてのテキストが表示されます。

于 2013-09-10T10:05:44.470 に答える