0

次の（簡略化された）レイアウトのユーザーコントロールがあります。

<UserControl x:Name="FV">
 <DockPanel LastChildFill="False">
  <StackPanel DockPanel.Dock="Left">
    ... some content, let's say customer name ...
  </StackPanel>
  <MyButton DockPanel.Dock="Left"
    Visibility="{Binding Path=IsMouseOver, ElementName=FV, Converter={StaticResource boolToVisibilityConverter}}">
  </MyButton>
 </DockPanel>
</UserControl>

したがって、基本的にはテキストが表示され、ホバーするとこのテキストのすぐ右に編集ボタンが表示されます。

今度は、このコントロールをツリーの ItemTemplate として使用します。

問題は長い名前にあります。この場合、ツリーは水平スクロールになり、UserControl は論理的に右に伸び、ボタンは表示されなくなります。

text1 (edit)  |
text22 (edit) |
vverylongtext |

ホバー時に非常に長いテキストをボタンに重ねたい：

text1 (edit)  |
text22 (edit) |
vverylo(edit) |

どうすればこれを達成できますか？私の UserControl には、それが使用されている場所に関する知識がないため、親要素の ActualWidth に関する知識がありません。

4

2 に答える 2

0

私はあなたの要件に従ってそれを正確に行いました。とで を作成しましUserControlた。テキスト入力が非常に長い場合、見えないままになりますが、必要に応じて正確に表示されます。ただし、テキストが十分に小さいままである場合は、表示されたままになります。TextBlockButtonTextBlockButtonMouseOverTextBlockButton

注:HorizontalAlignment = Leftで設定する必要がありますButton。

Window3.xaml

<Window x:Class="WpfStackOverflow.Window3"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:uc="clr-namespace:WpfStackOverflow"
        Title="Window3" Height="300" Width="300" SizeToContent="WidthAndHeight">

    <StackPanel>
        <uc:UserControl1 Width="200" Height="35"/>
    </StackPanel>

</Window>

UserControl.1.xaml

<UserControl x:Class="WpfStackOverflow.UserControl1"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             mc:Ignorable="d" 
             xmlns:local="clr-namespace:WpfStackOverflow"
             Background="Bisque"
             Height="25">       

    <StackPanel x:Name="DckPnl" Height="25" Orientation="Horizontal">
        <TextBlock x:Name="Tb" MouseEnter="Tb_MouseEnter_1" MouseLeave="Tb_MouseLeave_1" FontFamily="Arial" Text="some content , let's say customer name some content, let's say customer name" Background="AliceBlue"/>
        <Button x:Name="Btn" Visibility="Hidden" Content="Edit" Width="35" Height="25" Margin="0 0 0 0" HorizontalAlignment="Left"/>
    </StackPanel>

</UserControl>

UserControl1.xaml.cs

using System;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Input;
using System.Windows.Media;

namespace WpfStackOverflow
{
    /// <summary>
    /// Interaction logic for UserControl1.xaml
    /// </summary>
    public partial class UserControl1 : UserControl
    {
        public UserControl1()
        {
            InitializeComponent();
        }

        private void Tb_MouseEnter_1(object sender, MouseEventArgs e)
        {
            Thickness newMargin = new Thickness();

            FormattedText f = new FormattedText(Tb.Text,
                                                new System.Globalization.CultureInfo("en-US"),
                                                System.Windows.FlowDirection.LeftToRight,
                                                new Typeface("Arial"),
                                                Tb.FontSize, Brushes.Black);
            if (f.Width > this.ActualWidth)
                newMargin = new Thickness((this.ActualWidth - f.Width) - Btn.ActualWidth, 0, 0, 0);
            else
                newMargin = Btn.Margin;

            Btn.Margin = newMargin;
            Btn.Visibility = System.Windows.Visibility.Visible;
        }

        private void Tb_MouseLeave_1(object sender, MouseEventArgs e)
        {
            Btn.Margin = new Thickness(0, 0, 0, 0);
            Btn.Visibility = System.Windows.Visibility.Hidden;
        }
    }   
}
于 2016-09-23T15:19:59.397 に答える
0

テキストの上にボタンを配置するには、AdornerLayer、Z-Index、Tooltip、または Popup を使用できます。最後は私にとって最も簡単な解決策のようです。ポップアップを使用して実行する方法の例を次に示します。

<StackPanel Margin="0 20 0 0" Name="StackPanel" Width="100">
    <ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto">
        <ScrollViewer.Resources>
            <wpfApplication1:OrConverter x:Key="OrConverter" />
        </ScrollViewer.Resources>
        <StackPanel Orientation="Horizontal">
            <TextBlock Text="longlonglonglongtextlonglonglonglongtextlonglonglonglongtext" />
            <Popup x:Name="Popup" StaysOpen="True"
                   PlacementTarget="{Binding ElementName=StackPanel}"
                   Placement="Right"
                   HorizontalOffset="-20"> <!--here you can bind to button's width instead of static value-->
                <Popup.IsOpen>
                    <MultiBinding Converter="{StaticResource OrConverter}">
                        <Binding ElementName="StackPanel" Path="IsMouseOver" Mode="OneWay" />
                        <Binding ElementName="Popup" Path="IsMouseOver" Mode="OneWay" />
                    </MultiBinding>
                </Popup.IsOpen>
                <Button Name="Button" Content="X" Height="16" Width="20" VerticalAlignment="Top" />
            </Popup>
        </StackPanel>
    </ScrollViewer>
</StackPanel>

OrConverter はこの回答にあります。

そして、それはこのように見えます。

于 2016-09-23T12:13:33.237 に答える