Khalil Khalaf
Khalil Khalaf

Reputation: 9407

Why this button has a small functionality area?

I have this which is behaving like a button in a WPF Application. It has an image on it. It's working fine, however the user needs to press exactly in the middle to get its functionality.

So the image is covering the whole "button" which technically is a border. Yet users only have a very tiny space to click. All edges up to maybe 20 pixels away from each edge are not functional. What would be the reason the user has very small functional space?

<Border x:Name="previewButton" Margin="0,10" Height="89" Padding="0" MouseDown="previewButton_MouseDown" MouseUp="previewButton_MouseUp" BorderBrush="#FF535151" BorderThickness="1" MouseLeave="previewButton_MouseLeave" TouchDown="previewButton_TouchDown" TouchUp="previewButton_TouchUp" TouchLeave="previewButton_TouchLeave" >
    <Image Width="50" Source="/EZ3D;component/Resources/old/eye.png" Margin="4.2,0.2,3.4,0.2" />
</Border>

Border:

enter image description here

Image on the border:

enter image description here

Upvotes: 0

Views: 39

Answers (1)

Clemens
Clemens

Reputation: 128060

Set the Background of the Border to Transparent to make it hit-test visible:

<Border Background="Transparent" ...>

Upvotes: 1

Related Questions