Make command work only in part of a window

Question

I have this xaml

<Window x:Class="WpfApplication1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:this="clr-namespace:WpfApplication1"
        Title="MainWindow" Height="350" Width="525" Name="this">
    <Grid>
        <Grid.CommandBindings>
            <CommandBinding Command="{x:Static this:MainWindow.Cmd}" Executed="CommandBinding_Executed"/>
        </Grid.CommandBindings>
        <Grid.InputBindings>
            <MouseBinding Command="{x:Static this:MainWindow.Cmd}" MouseAction="LeftClick"/>
        </Grid.InputBindings>
        <Rectangle Fill="Yellow"/>
        <Rectangle Fill="Green" Margin="50">
            <Rectangle.InputBindings>
                <MouseBinding Command="NotACommand" MouseAction="LeftClick"/>
            </Rectangle.InputBindings>
        </Rectangle>
    </Grid>
</Window>

and this code-behind file:

namespace WpfApplication1
{
    public partial class MainWindow : Window
    {
        static RoutedCommand cmd = new RoutedCommand();

        public static RoutedCommand Cmd
        {
            get { return MainWindow.cmd; }
            set { MainWindow.cmd = value; }
        }

        public MainWindow()
        {
            InitializeComponent();
        }
        private void CommandBinding_Executed(object sender, ExecutedRoutedEventArgs e)
        {
            MessageBox.Show("Cmd");
        }
    }
}

As you can see there is a command called Cmd in the window. There are 2 rectangles within the window - yellow and green. I want the command Cmd to work only when mouse clicked in yellow rect, but not in green rect. How can I achieve this?

score 0 · Answer 1 · answered Mar 19 '13 at 09:20

Sounds like you should put your yellow rectangle on a Button and assign the command directly to it. E.g. like this.

<Button Command="YourCommandHere">
    <RecTangle Fill="Yellow" />
    <!-- let your button look and behave like the rectangle -->
    <Button.Template>
        <ControlTemplate x:TargetType="Button">
            <ContentPresenter Content="{TemplateBinding Content}" />
        </ControlTemplate>
    </Button.Template>
</Button>

I think that is the cleanest way.

score 0 · Answer 2 · answered Mar 19 '13 at 09:20

0

Instead of

<Grid.CommandBindings>
    <CommandBinding Command="{x:Static this:MainWindow.Cmd}" Executed="CommandBinding_Executed"/>
</Grid.CommandBindings>
<Grid.InputBindings>
    <MouseBinding Command="{x:Static this:MainWindow.Cmd}" MouseAction="LeftClick"/>
</Grid.InputBindings>

Use

<Rectangle Fill="Green" Margin="50">
    <Rectangle.InputBindings>
        <MouseBinding Command="{x:Static this:MainWindow.Cmd}" MouseAction="LeftClick"/>
    </Rectangle.InputBindings>
</Rectangle>

Maybe it does need some tweak to ensure the binding and command. Personally I don't use this direct approach. I usually use ViewModel with DataContext.

answered Mar 19 '13 at 09:20

Fendy

4,565
1
20
25

Actually I need something opposite - the command should work for yellow rectangle(basically it becomes yellow frame) and it should ignore clicks within green rectangle(the inner one) so it is like a border. When you click on a border command executes, but when you click inside it does nothing. I tried binding a command to the outer rectangle but still it executes for inner rectangle too. That's not what I want. – Blablablaster Mar 19 '13 at 09:27
I see, then you can use DHN's solution. I found similiar article like this tough. http://stackoverflow.com/questions/1068979/wpf-rectangle-does-not-have-a-click-event – Fendy Mar 19 '13 at 09:47

Make command work only in part of a window

2 Answers2