3

リソースとして宣言されたポップアップ スタイルがあります。私はこのポップアップを開いたときに(データトリガーを使用して)PlacementTarget IsMouseOver = true、ポップアップ自体が表示されたときに開きますIsMouseOver = TrueIsMouseOver = Falseポップアップがポップアップを閉じるときのトリガーを追加しました。ただし、ユーザーがポップアップの外側をクリックしない限り、開いたままになります。マウスがポップアップを離れて配置ターゲットの上にないときに閉じたい。

これが私のポップアップスタイルです:

<Style x:Key="FTC_PopupStyle" TargetType="{x:Type Popup}">
    <Setter Property="StaysOpen" Value="False"/>
    <Setter Property="PopupAnimation" Value="Slide"/>
    <Setter Property="AllowsTransparency" Value="True"/>
    <Style.Triggers>
        <DataTrigger Binding="{Binding Path=IsMouseOver, RelativeSource={RelativeSource Self}}" Value="True">
            <Setter Property="IsOpen" Value="True" />
        </DataTrigger>
        <DataTrigger Binding="{Binding Path=IsMouseOver, RelativeSource={RelativeSource Self}}" Value="False">
            <Setter Property="IsOpen" Value="False" />
        </DataTrigger>
        <DataTrigger Binding="{Binding Path=PlacementTarget.IsMouseOver, RelativeSource={RelativeSource Self}}" Value="True">
            <Setter Property="IsOpen" Value="True" />
        </DataTrigger>
    </Style.Triggers>
</Style>

質問:マウスがターゲットから離れたときにポップアップが閉じるように、誰かがこれを調整するのを手伝ってくれますか?

編集:1

さて、これは一般的な問題のようですが、うまくいく解決策が見つかりませんでした。ホバーボタンを実装したいと考えています。ユーザーがポップアップの配置ターゲットである UI 要素の上にマウスを移動すると、コマンドのリストが表示されます。ボタンにポップアップを添付してこれを行うことができます。

私が必要とするのは、マウスが上にないときにポップアップを閉じることです。コード ビハインドを使用したいと考えていますが、mouseLeaveandisMouseOverChangedイベントは、ユーザーがポップアップの外側をクリックしたときにのみ発生し、マウス ポインターがポップアップの真上から移動したときでは発生しません。IsOpen=Falseまた、MouseLeaveイベントで設定すると、ポップアップは再び開きません。こんなに難しいものだとは驚きです。

これにはカスタム コントロールを作成する必要があると思います。

編集2:

わかりやすくするためのスクリーンショットを次に示します。 ここに画像の説明を入力

ユーザーが「JOB MANAGEMENT」ボタンにカーソルを合わせたときにポップアップが開くようにします。次に、ユーザーがポップアップ コントロールのボタンの 1 つをクリックできるように、ユーザーがポップアップ自体の上にマウスを移動した場合、ポップアップを開いたままにしておきます。しかし、マウスがポップアップ自体またはJOB MANAGEMENTボタンの上にない場合は、ポップアップを閉じてください。

マウスがポップアップを離れたときにポップアップを強制的に閉じる方法について誰か考えがありますか? 私の理想的な解決策は、リソース ディクショナリのスタイル内で定義できるものです。

編集3:

isOpenMarc の提案に従って、ラッピング コンテナーにバインドしようとして使用した XAML を次に示します。それは動かなかった:

<StackPanel x:Name="JobListPanel">
    <Button x:Name="SubJobList" Content="JO_B MANAGEMENT" Style="{StaticResource NavChildButton}" />
    <Popup x:Name="JobPopUp" PlacementTarget="{Binding ElementName=SubJobList}" Style="{StaticResource FTC_PopupStyle}"  >
        <Border Style="{StaticResource FTC_PopupBorder}" >
            <WrapPanel Orientation="Vertical" >
                <Button Content="Vie_w Jobs" Style="{StaticResource NavSubButton}"  />
                <Button Content="Add _New Job" Style="{StaticResource NavSubButton}"  />
                <Button Content="Job _Reports" Style="{StaticResource NavSubButton}" />
            </WrapPanel>
        </Border>
    </Popup>
</StackPanel>

<Style x:Key="FTC_PopupStyle" TargetType="{x:Type Popup}">
    <Setter Property="PopupAnimation" Value="Slide"/>
    <Setter Property="AllowsTransparency" Value="True"/>
    <Style.Triggers>
        <DataTrigger Binding="{Binding Path=IsMouseOver, UpdateSourceTrigger=PropertyChanged, RelativeSource={RelativeSource Self}}" Value="True">
            <Setter Property="IsOpen" Value="True" />
        </DataTrigger>
        <DataTrigger Binding="{Binding Path=IsMouseOver, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type StackPanel}}}" Value="True">
            <Setter Property="IsOpen" Value="True" />
        </DataTrigger>
    </Style.Triggers>
</Style>
4

4 に答える 4

2

このスタイルを削除

 <Setter Property="StaysOpen" Value="False"/>

またはそれを作るとTrue、うまくいきます。

MSDNの状態:

StaysOpen プロパティが true に設定されている場合、Popup は、IsOpen プロパティを false に設定して明示的に閉じるまで開いたままになります。StaysOpen が false の場合、Popup コントロールはすべてのマウス イベントとキーボード イベントをインターセプトして、これらのイベントのいずれかが Popup コントロールの外部でいつ発生するかを判断します。

IsOpenここでは、プロパティを自分で設定してポップアップの動作を制御します。StaysOpenしたがって、 に設定する必要がありますTrue

于 2013-11-13T18:41:02.313 に答える
1

カスタム コントロールなどを作成したことは知っていますが、これが誰かの役に立つかもしれません。

  <Grid Background="Black">
    <Grid.RowDefinitions>
      <RowDefinition Height="Auto" />
      <RowDefinition Height="*" />
    </Grid.RowDefinitions>
    <Grid>
      <TextBlock x:Name="JobManagement" Text="Job Management" 
               Foreground="LightGray" FontSize="15" FontWeight="Bold" HorizontalAlignment="Left"
               MouseEnter="OnMouseEnter" MouseLeave="OnMouseLeave" />

      <Popup x:Name="JobManagementMenu" Placement="Bottom"
           MouseLeave="OnMouseLeave">
        <Grid Background="LightGray">
          <StackPanel Margin="5 2 15 5">
            <TextBlock Text="View Jobs" Foreground="DarkCyan" FontSize="13" />
            <TextBlock Text="Add New Job" Foreground="DarkCyan" FontSize="13" />
            <TextBlock Text="Job Reports" Foreground="DarkCyan" FontSize="13" />
          </StackPanel>
        </Grid>
      </Popup>
    </Grid>

    <TextBlock Grid.Row="1" TextWrapping="Wrap"
               Text="Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua" 
               Foreground="DarkGray" Margin="0 5 0 0" />
  </Grid>

また、バックエンドの場合は、マウスがどちらのコントロールからも離れたときに閉じます。

private void OnMouseEnter(object sender, MouseEventArgs e)
{
    if (!JobManagementMenu.IsOpen)
        JobManagementMenu.IsOpen = true;
}

private void OnMouseLeave(object sender, MouseEventArgs e)
{
    if (JobManagement.IsMouseOver || JobManagementMenu.IsMouseOver)
        return;
    JobManagementMenu.IsOpen = false;
}
于 2014-03-21T22:40:27.160 に答える
0

ポップアップを自分自身にバインドすると思います-間違っています。テキストボックスのような別のコントロールにバインドするときのより良い方法。ポップアップが単独で使用されることはありません。常に他のコントロールと連携します。

<TextBox x:Name="text" Text="This is a text box" />

<Style x:Key="FTC_PopupStyle" TargetType="{x:Type Popup}">
    <Setter Property="StaysOpen" Value="False"/>
    <Setter Property="PopupAnimation" Value="Slide"/>
    <Setter Property="AllowsTransparency" Value="True"/>
    <Style.Triggers>
    <Style.Triggers>
        <DataTrigger Binding="{Binding ElementName=text, Path=IsFocused}" Value="True">
            <Setter Property="IsOpen" Value="True" />
        </DataTrigger>

        // other triggers
    <Style.Triggers>
</Style>
于 2013-11-11T09:30:05.030 に答える