Develop Reference

How to Navigate between xaml controls of UWP using mouse wheel?

I am developing a UWP application in which I have several XAML controls(buttons, textblocks, checkboxes, etc). Ideally, The final user of this app should be able to navigate between these controls ONLY USING MOUSE WHEEL(this is a medical device UI in which only a mouse wheel will be available on top of the monitor). Now my question is that how to force this application use mouse wheel as the primary source of navigation between controls?
Some more feedbacks:
1.Right now, when I run my application in visual studio, I just see mouse pointer and of course buttons are sensitive to mouse clicks but in order to initiate an event, I have to hover to that element and click. MOUSE WHEEL IS NOT WORKING by default to navigate and select controls.
2.when I sideload this UWP application on a raspberry pi device and run the application there, the only way to navigate between controls is using an attached keyboard(possible to navigate and select controls using it). AGAIN ATTACHED MOUSE WHEEL IS NOT WORKING HERE.
an example of controls I use in my code is this:
xaml code:
<Button x:Name="button1" Grid.Column="0" Grid.Row="0" Content="Button1" Click="button1_click" />
<Button x:Name="button2" Grid.Column="1" Grid.Row="0" Content="Button2" Click="button2_click" />
<Button x:Name="button3" Grid.Column="2" Grid.Row="0" Content="Button3" Click="button3_click" />
c# code:
private void button1_click(object sender, Windows.UI.Xaml.RoutedEventArgs e)
{
//do sth
}
private void button2_click(object sender, Windows.UI.Xaml.RoutedEventArgs e)
{
//do sth
}
private void button3_click(object sender, Windows.UI.Xaml.RoutedEventArgs e)
{
//do sth
}
in above code, it is not possible to navigate between three buttons using mouse wheel(both in visual studio and raspberry pi).

AGAIN ATTACHED MOUSE WHEEL IS NOT WORKING HERE.
How did you register the 'MOUSE WHEEL' event in your code? It worked well on my side.
Please see the following code sample:
<StackPanel x:Name="root" >
<Button x:Name="button1" Grid.Column="0" Grid.Row="0" Content="Button1" Click="button1_click" />
<Button x:Name="button2" Grid.Column="1" Grid.Row="0" Content="Button2" Click="button2_click" />
<Button x:Name="button3" Grid.Column="2" Grid.Row="0" Content="Button3" Click="button3_click" />
</StackPanel>
public MainPage()
{
this.InitializeComponent();
Window.Current.CoreWindow.PointerWheelChanged += CoreWindow_PointerWheelChanged;
}
private async void CoreWindow_PointerWheelChanged(Windows.UI.Core.CoreWindow sender, Windows.UI.Core.PointerEventArgs args)
{
Debug.WriteLine(args.CurrentPoint.Properties.MouseWheelDelta);
UIElement element;
if (args.CurrentPoint.Properties.MouseWheelDelta > 0)
{
element = FocusManager.FindNextFocusableElement(FocusNavigationDirection.Up);
if (element == null)
{
element = FocusManager.FindLastFocusableElement(root) as UIElement;
}
var result = await FocusManager.TryFocusAsync(element, FocusState.Keyboard);
Debug.WriteLine((element as Button).Content.ToString() + " focused: " + result.Succeeded);
}
else
{
element = FocusManager.FindNextFocusableElement(FocusNavigationDirection.Down);
if (element == null)
{
element = FocusManager.FindFirstFocusableElement(root) as UIElement;
}
var result = await FocusManager.TryFocusAsync(element, FocusState.Keyboard);
Debug.WriteLine((element as Button).Content.ToString() + " focused: " + result.Succeeded);
}
}

just to give you an idea.
First you should handle tabIndex properties of all of those Items on form and set their order. also whats being triggered with you will move with the tab in your case with mouse wheel gonna be "Focused" or "GotFocus" method. so an event like "GotFocus" will be needed. also you need to handle mouse wheel movements(up or down). you may google about how to override TabIndex property from tab Key to Mouse wheel as you want.

WPF Copied Button Click not firing

I'm quite new to c# wpf and have a problem.
I have used the answer from this post to duplicate a Grid control. The grid control contains a button. It looks like it is being duplicated correctly.
When the original control's button is pressed, the click event is handled which calls a method in the window's code.
When the copy of the control's button is pressed, the click event is not fired and the method is not called. This is confusing me as I want it to call that same method.
Maybe the event handling data is not being copied properly? Is there a way around this?
Both the origional grid and copied grid (containing the buttons) are children of another grid.
Edit:
This is the xaml for the origional grid which contains a button:
<Grid Name="TempTab" DockPanel.Dock="Left" HorizontalAlignment="Left" Margin="5,5,5,0">
<Rectangle Fill="Black" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Stroke ="White" Margin="0,0,-2,0">
</Rectangle>
<Grid>
<DockPanel LastChildFill="False">
<TextBlock Foreground="White" HorizontalAlignment="Left" VerticalAlignment="Bottom" Margin="3,0,3,3">Some Text</TextBlock>
<Button Width="50" BorderBrush="{x:Null}" Foreground="{x:Null}" BorderThickness="0" Margin="3,0,0,0" Click="tabdowntest">
<Button.Background>
<ImageBrush ImageSource="TopMenuBar_Close.png" Stretch="Uniform"/>
</Button.Background>
</Button>
</DockPanel>
</Grid>
</Grid>
This grid is a child of a DockPanel with name 'TabsDock'.
It is being copied with the following code:
string gridXaml = XamlWriter.Save(TempTab);
StringReader stringReader = new StringReader(gridXaml);
XmlReader xmlReader = XmlReader.Create(stringReader);
Grid newTab = (Grid)XamlReader.Load(xmlReader);
TabsDock.Children.Add(newTab);
This is the code for the 'Click' event handler which should be called when the either the origional or the copied button's are pressed. But it is only called for the origional:
private void tabdowntest(object sender, MouseButtonEventArgs e)
{
Console.WriteLine("Button Pressed");
}

The bindigs are not set, you need to set them (comment in the orig post):
To be clear, this is only half the solution (as it stood back in 08). This will cause bindings to be evaluated and the results be serialized. If you wish to preserve bindings (as the question asked) you must either add a ExpressionConverter to the Binding type at runtime (see the second part of my question for the relevant link) or see my own answer below for how to do it in 4.0.

MouseLeftButtonUp does not fire all the time in WP7

In my app there is a canvas with a small image (not taking up entire space of canvas).
when user clicks on image and drags inside the canvas, it traces the path with a black line. Till here everything works. Now, I want the path to be deleted as soon as the user releases the hold on the mouse. I am using MouseLeftButtonUp on the canvas to detect the mouse release. Now problem is this is working randomly. sometimes it fires and sometimes it does not. Kindly help.
XAML:
<Canvas Height="400" HorizontalAlignment="Center" Margin="10,10,0,0" Name="canvas1" VerticalAlignment="Center" Background="Aqua" Width="400">
<Image Canvas.ZIndex="30" Canvas.Left="10" Canvas.Top="10" Height="20" Name="dot1" Stretch="Uniform" Width="20" Source="/BoxIt;component/Images/dot.png" MouseLeftButtonDown="dot_MouseLeftButtonDown" />
</Canvas>
C#:
this.canvas1.MouseMove += new MouseEventHandler(canvas1_MouseMove);
this.canvas1.MouseLeftButtonUp += new MouseButtonEventHandler(canvas1_MouseLeftButtonUp);
Eventhandler in C# :
void canvas1_MouseLeftButtonUp(object sender, MouseButtonEventArgs e)
{
// code to delete the path
}

In Windows Phone we are advised to use the Tap, Hold and Manipulation* methods instead of the Mouse related events.
Please read this for more information.

how to change image button image when we click on button in silverlight?

I have one image button in Silverlight
in initial load it will show demo1 image, whenever I click on that button i should change image to demo2.
<Button x:Name="demo"
IsEnabled="False"
Click="demo_Click"
ToolTipService.ToolTip="demo"
Width="25"
Height="25"
VerticalAlignment="Bottom"
HorizontalAlignment="Left"
Margin="0,0,0,25">
<Image x:Name="demo-image" Source="/demo.content;component/demo1.png"/>
</Button>

First of all, remove IsEnabled="False" from the Button XAML. Then simply implement the demo_Click event handler in your code-behind as follows:
private void demo_Click(object sender, RoutedEventArgs e)
{
demo_image.Source = new BitmapImage(
new Uri("/demo.content;component/demo2.png", UriKind.Relative));
}

You can use a ToggleButton instead

WPF - Capture an event from a control that is not on top

I have a WPF application that I am working on where there is a button that is obscured by a partially opaque rectangle overlay. The button is still visible, but it can not receive any events because they are all caught by the rectangle which is on top of it.
Is there any way to set a pass-through so that the event is received by the next visual item underneath? If not is there some other workaround that could be used in this situation?

Set IsHitTestVisible="false" on the opaque overlay.

You need to set IsHitTestVisible="False" for the control over your button.
This example shows that a button is covered by a border, but the border doesn't get any event since because of the IsHitTestVisible="False" condition of border:
<Grid Background="Yellow">
<Button Click="Button_Click" Width="100" Height="25"/>
<Border Background="Cyan" Opacity="0.4" Width="200" Height="200" IsHitTestVisible="False" />
</Grid>
C# code,
private void Button_Click(object sender, RoutedEventArgs e)
{
MessageBox.Show("iiiiiii");
}

You could add the your own event to the rectangle event (or in the click event of the rectangle it self) and check there if it's with in buttons area
Rectangle.Click += your_click_event;
private void your_click_event(object sender, RoutedEventArgs e)
{
//check if it's coordinates are within the underlining button.
//fire button click event
}
But it would be more convient to set
IsHitTestVisible="False"
Like mentioned in other posts. UIElement.IsHitTestVisible Property

I would recommend to look in to routed events in WPF. Routed events get routed based primarily on the visual tree. Routed events support a RoutingStrategy of Bubble, Tunnel, or Direct.
Understanding Routed Events and Commands In WPF