How to apply a mouse event on padding whitespace caused by Uniform settings？-CodePudding

I'm wondering about the padding white space caused by the Uniform setting.

I want to apply a mouse event on fill blank caused by Uniform setting.

How to do it? Thanks for any help.

Xaml:

<StackPanel>
    <StackPanel.Background>
          <ImageBrush x:Name="CurrentPageImage" Stretch="Uniform" ImageSource="{Binding CurrentTextBook}" />
    </StackPanel.Background>
</StackPanel>

Codebehind:

public MainWindow()
    {
      InitializeComponent();
      DataContext = this;
  
      CurrentTextBook = new BitmapImage(new Uri(@"C:\...\11.png"));
    }

    public ImageSource CurrentTextBook { get; set; }

    public ImageBrush MyBrush
    {
      get
      {
        ImageBrush brush = new ImageBrush();
        brush.ImageSource = CurrentTextBook;
        return brush;
      }
    }

CodePudding user response：

I don't think you're going to be able to do this while rendering the image in an ImageBrush. If you need that top control to have StackPanel functionality then use an ItemsControl instead; it uses StackPanel internally, and thus will layout any children the same, but it will allow you to template it out:

<ItemsControl Template="{DynamicResource ItemsControlTemplate1}"     
    ... etc ... // no need to set Background property

Then, inside the template itself, you simply place a grid and an image behind the StackPanel items to effectively do what the ImageBrush was doing:

<ControlTemplate x:Key="ItemsControlTemplate1" TargetType="{x:Type ItemsControl}">
    <Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}" SnapsToDevicePixels="true">
        <Grid MouseDown="Grid_MouseDown" Background="Transparent">
            <Image Stretch="Uniform" Source="{Binding CurrentTextBook}" MouseDown="Image_MouseDown" />
            <ItemsPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
        </Grid>
    </Border>
</ControlTemplate>

Note that setting the Grid background to Transparent is important, you won't get any MouseDown events firing if you don't.

As for the two MouseDown handlers, the one for the image should block the click from bubbling up the visual tree. Thus, if the one for the Grid is fired, you know the user has clicked inside the ItemsControl/StackPanel but outside the image:

private void Image_MouseDown(object sender, MouseButtonEventArgs e)
{
    // prevent the message from bubbling back up to the parent grid
    e.Handled = true;
}

private void Grid_MouseDown(object sender, MouseButtonEventArgs e)
{
    // mouse was clicked outside the image area
}

CodePudding user response：

If I understand your issue correctly, you could just wrap the StackPanel in another painted Panel and handle the mouse event of this one:

<Grid Background="Transparent" MouseLeftButtonDown="Grid_MouseLeftButtonDown">
    <StackPanel>
        <StackPanel.Background>
            <ImageBrush x:Name="CurrentPageImage" Stretch="Uniform" ImageSource="{Binding CurrentTextBook}" />
        </StackPanel.Background>
    </StackPanel>
</Grid>