Question

我正在寻找一种在画布上绘制的矩形的相对位置显示文本的方法画布有很多形状，因此它被定义为带有setter的容器，如何将矩形的文本框设置为相对于矩形位置？文本框始终显示在矩形的上方或下方，并忽略我为其设置的位置

<StackPanel Orientation="Vertical" Grid.Row="2" Grid.ColumnSpan="2">
    <ItemsControl Name="itemtest" ItemsSource="{Binding}" Height="429">
        <ItemsControl.ItemsPanel>
            <ItemsPanelTemplate>
                <local2:DragCanvas x:Name="canvas1" AllowDragging="true" AllowDragOutOfView="True" Width="704"
                                   Height="576" Background="Blue" />
            </ItemsPanelTemplate>
        </ItemsControl.ItemsPanel>
        <ItemsControl.ItemContainerStyle>
            <Style TargetType="ContentPresenter">
                <Setter Property="Canvas.Left" Value="{Binding Path=Location.X, Mode=TwoWay}" />
                <Setter Property="Canvas.Top" Value="{Binding Path=Location.Y,  Mode=TwoWay}" />
                <Setter Property="Visibility"
                        Value="{Binding Path= ShowOnDemo, Converter={StaticResource BooleanToVisibilityConverter}}" />
            </Style>
        </ItemsControl.ItemContainerStyle>
        <ItemsControl.ItemTemplateSelector>
            <local:CustomTemplateSelector>
                <local:CustomTemplateSelector.BitmapTemplate>
                    <DataTemplate>
                        <StackPanel>
                            <Image Source="{Binding Path=Bitmaps/myBitmap}" />
                        </StackPanel>
                    </DataTemplate>
                </local:CustomTemplateSelector.BitmapTemplate>
                <local:CustomTemplateSelector.HorBarTemplate>
                    <DataTemplate>
                        <StackPanel>
                            <Rectangle Fill="{Binding Path= Color.ForeColor}" Width="100" Height="20" />
                            <TextBlock Canvas.Left="{Binding Path=Location.X+100}"
                                       Canvas.Right="{Binding Path=Location.Y+100}" Text="{Binding Path=RightLabel}" /> -- not working!!
                        </StackPanel>
                    </DataTemplate>
                </local:CustomTemplateSelector.HorBarTemplate>
            </local:CustomTemplateSelector>
        </ItemsControl.ItemTemplateSelector>
    </ItemsControl>
</StackPanel>

更新：

我尝试给出绝对位置，但忽略了它 -

                                <Grid>
                                    <Rectangle Fill="{Binding Path= Color.ForeColor}" Width="100" Height="20" />
                                    <TextBlock Style="{x:Null}"  Text="{Binding Path=RightLabel}" Canvas.Left="200" Canvas.Right="200" Margin="150" />
                                </Grid>

它仍然给我设置文本和矩形的位置这也意味着第一个解决方案也不会起作用

Answer 1

您需要在Location类中定义另外两个属性并绑定它们：

public class Location
{
    public double X { get; set; }
    public double Y { get; set; }

    public double ShiftedX 
    {
        get { return X + 100; }
    }

    public double ShiftedY
    {
        get { return Y + 100; }
    }
}

<强>更新

好像你只是想摆脱你的StackPanel（当然按顺序定位你的元素）并使用另一个容器，比如Grid：

        <local:CustomTemplateSelector.HorBarTemplate>
            <DataTemplate>
                <Grid>
                    <Rectangle Fill="{Binding Path= Color.ForeColor}" Width="100" Height="20" />
                    <TextBlock Text="{Binding Path=RightLabel}" />
                </Grid>
            </DataTemplate>
        </local:CustomTemplateSelector.HorBarTemplate>

<强>更新

一些可能的布局：

<Window x:Class="WpfTestBench.Containers"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Containers" Height="300" Width="300">
    <Grid ShowGridLines="True">
        <Grid.RowDefinitions>
            <RowDefinition />
            <RowDefinition />
            <RowDefinition />
            <RowDefinition />
        </Grid.RowDefinitions>

        <!-- Yours stackpanel -->
        <StackPanel Grid.Row="0">
            <Rectangle Stroke="Black" StrokeThickness="1" Width="100" Height="20"  />
            <TextBlock Text="Test text" />
        </StackPanel>

        <!-- Rectangle with specified size inside grid -->
        <Grid Grid.Row="1">
            <Rectangle Stroke="Black" StrokeThickness="1" Width="100" Height="20"  />
            <TextBlock Text="Test text" />
        </Grid>

        <!-- Rectangle with specified size and aligned textblock inside grid -->
        <Grid Grid.Row="2">
            <Rectangle Stroke="Black" StrokeThickness="1" Width="100" Height="20"  />
            <TextBlock Text="Test text" HorizontalAlignment="Center" VerticalAlignment="Center" />
        </Grid>

        <!-- Rectangle with no size specified (stretches) and aligned textblock inside grid -->
        <Grid Grid.Row="3">
            <Rectangle Stroke="Black" StrokeThickness="1"  />
            <TextBlock Text="Test text" HorizontalAlignment="Center" VerticalAlignment="Center" />
        </Grid>
    </Grid>
</Window>

执行结果：

Layouts

在画布上显示与setter相对位置的文本

1 个答案: