Floating custom touch control in WPF - c#

I am trying to create a floating control in WPF that can receive touch events. I searched a lot and the only solution for a floating control I found was the Popup control. Problem: The Popup control cannot receive touch events. And since I am using a SurfaceListBox inside my Popup, I need touch events. I tried to make the popup receive touch events via the following:
TouchExtensions.EnableSurfaceInput((HwndSource)HwndSource.FromVisual(this.selectionListPopup));
but it didn't have any effect. Is there any way to make popups receive touches? Is there any other control or way that could be used?
My end goal is to have a control that is floating above other controls - that means it is not clipped or obscured by other controls.
Here is the XAML I used so far:
<Popup Name="selectionListPopup"
PlacementTarget="{Binding ElementName=selectedItemButton}"
Placement="Relative"
VerticalOffset="{Binding ElementName=this, Path=SelectionListTop}"
HorizontalOffset="{Binding ElementName=this, Path=SelectionListLeft}"
IsOpen="{Binding ElementName=this, Path=IsSelecting, Mode=TwoWay}"
StaysOpen="False"
AllowsTransparency="True"
Focusable="False">
<s:SurfaceListBox Name="selectionList"
ItemsSource="{Binding ElementName=this, Path=ItemsSource}"
SelectedItem="{Binding ElementName=this, Path=SelectedItem, Mode=TwoWay}"
SelectionChanged="OnSelectionListSelectionChanged">
</s:SurfaceListBox>
</Popup>

It's not the HwndSource of the Popup, but the HwndSource of the visual parent of the Popup.Child. Sounds strange, I know.
So in the Opened-event of my popup I call the following code:
var myPopup = sender as Popup;
HwndSource hwndSource = (HwndSource)PresentationSource.FromVisual((Visual)VisualTreeHelper.GetParent(myPopup.Child));
hwndSource.EnableSurfaceInput();

Related

Changing property IsIndeterminate on MaterialDesign button in WPF

I'm using a material design button in WPF and I'm not quite sure how to control the property IsIndeterminate from within C# code as the below does not work, like it usually does with "standard" properties like Content etc.
BTN_Search.materialDesign:ButtonProgressAssist.IsIndeterminate = true;
The WPF for the button below:
<Grid Width="124" Margin="5" VerticalAlignment="Center">
<Button Style="{StaticResource MaterialDesignRaisedButton}"
materialDesign:ButtonProgressAssist.Value="-1"
materialDesign:ButtonProgressAssist.IsIndicatorVisible="True"
materialDesign:ButtonProgressAssist.IsIndeterminate="False"
Content="Search"
Margin="2,0"
IsEnabled="{Binding DataContext.ControlsEnabled, RelativeSource={RelativeSource FindAncestor, AncestorType=Window}}"
x:Name="BTN_Search"
Click="Search_Click"/>
</Grid>
I want the materialDesign:ButtonProgressAssist.IsIndeterminate property to be changed in the Click event when the button is pressed and then once I am done processing I need to change it back to False.
It is a dependency property so it can be set like this:
ButtonProgressAssist.SetIsIndeterminate(BTN_Search, true);
There is other examples on Github in the MaterialDesignInXamlTooking project https://github.com/MaterialDesignInXAML/MaterialDesignInXamlToolkit/blob/master/MaterialDesignThemes.Wpf.Tests/ButtonProgressAssistTests.cs

Add Drag&Drop with Behaviors

I need to modify a desktop application which uses WPF, MVVM and Behaviors for event handling. I've got a task to implement Drag&Drop for a button. If the user presses the button it will popup a file-save window but if the user clicks and drags it, it should display a file icon and the let the user drop it into an Explorer window to save it there.
I've already added namespaces:
xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity"
xmlns:behaviors="clr-namespace:MyApplication.Desktop.Client.Behaviors"
xmlns:core="using:Microsoft.Xaml.Interactions.Core"
xmlns:command="http://www.galasoft.ch/mvvmlight"
I've also added XAML code into the button:
<Button Grid.Column="2"
Command="{Binding SaveAttachmentCommand}"
Visibility="{Binding RelativeSource={RelativeSource Self}, Path=IsEnabled, Converter={StaticResource boolToVisibilityConverter}}"
Style="{StaticResource AttachmentSaveButtonStyle}">
<i:Interaction.Triggers>
<i:EventTrigger EventName="PreviewMouseLeftButtonDown">
<command:EventToCommand Command="{Binding LeftMouseButtonDownCommand}"/>
</i:EventTrigger>
</i:Interaction.Triggers>
<i:Interaction.Behaviors>
<behaviors:FrameworkElementDragBehavior>
</behaviors:FrameworkElementDragBehavior>
</i:Interaction.Behaviors>
</Button>
But I don't know how to tell the behavior class (FrameworkElementDragBehavior) which events to handle and how to handle them (what functions to call).
I've read some tutorials but I'm still confused.
I had to do Drag and drop with MVVM two months ago.
After some research, personnaly, the best way to achieve that is to work with the "GongSolutions DragDrop" library.
It's very simple and it's perfect for what you're looking for.
For example, in a treeview:
<TreeView ItemsSource="{Binding LstCat}"
dd:DragDrop.IsDragSource="True"
dd:DragDrop.IsDropTarget="True"
dd:DragDrop.DragAdornerTemplate="{StaticResource DragAdorner}">
//Treeview Structure
</TreeView>
From there you can do Drag&Drop in the treeview. You can add a dragAdorner too (an image next to your pointer when you are dragging something)
In the viewModel you can tell the behaviour of the dragging or Dropping by implementing an interface which comes with the library. This way you can access to the data your dragging.
For example:
public void DragOver(IDropInfo dropInfo)
{
if (dropInfo.Data is Category && dropInfo.TargetItem is Rubrique)
{
return;
}
dropInfo.DropTargetAdorner = DropTargetAdorners.Highlight;
dropInfo.Effects = DragDropEffects.Move;
}
Here is the link of the library if you're interested:
https://github.com/punker76/gong-wpf-dragdrop

WPF Webbrowser control disable drop

Is there a way to disable dropping items like notepad, word etc on to a System.Windows.Controls.WebBrowser control in WPF.
I have tried various options like
AllowDrop="False" - Does not work.
Tried to catch events like Drop, PreviewDrop, DragLeave, PreviewDragLeave, PreviewDragOver, PreviewDragEnter - None of these events fire when I drop items on the WebBrowser control.
Using the constructor or Xaml to create the following method will stop the drag from changing the webbrowsers current state:
private void webBrowser_Navigating(object sender, NavigatingCancelEventArgs e)
{
// The WebBrowser control is checking the Uri
if (e.Uri.ToString() != "Place your url string here") //ex: "http://stackoverflow.com"
{
// Uri is not the same so it cancels the process
e.Cancel = true;
}
}
As you mentioned, none of the Drop event are fired, and it seems like the native browser control is very limited which leaves you with two possibilities:
Either user another browser control like wpfchromium,
Or define a transparent popup in top of the browser and handle
the drop even within it
:
<WebBrowser Height="300" Width="300" x:Name="wbBrowser"/>
<Popup Opacity="1" AllowsTransparency="True" IsOpen="True" Placement="Center"
PlacementTarget="{Binding ElementName=wbBrowser}" >
<Border Background="Black" Opacity="0.01"
Width="300" Height="300">
</Border>
</Popup>
This solution ain't pretty at all and needs also more logic to handle when the popup's parent control moves..
...you may also find this solution helpful, if your main content is html:
How to disable drop on wpf webbrowser control

Keyboard shortcuts not working until I click a control in the View for MVVM

I'm having a weird problem. I binded some keyboard shortcuts like so:
BroadcastView XAML:
<UserControl.InputBindings>
<KeyBinding Key="F1" Command="{Binding StartRoundClockCmd}"/>
<KeyBinding Key="F2" Command="{Binding StopRoundClockCmd}"/>
</UserControl.InputBindings>
MainWindow XAML
<Grid>
<TabControl>
<TabItem Header="Broadcast">
<view:BroadcastView/>
</TabItem>
<TabItem Header="Options">
<view:OptionsView/>
</TabItem>
</TabControl>
</Grid>
but the problem is.. when I start the application.. F1 and F2 don't work.. i can click anywhere within the TabItem thinking I just need it to focus the tabitem.. but still nothing.. it's only when I click within a textbox.. or click a button on the View (within the TabItem) first.. THEN the keyboard shortcuts work.
how can I get it so that the keyboard shortcuts will work from application startup using MVVM?
I would use Keyboard.Focus and FocusManager if I were you.
You can set the focus on your usercontrol so it receives the keyboard shortcuts.

Show flyout using BottomAppBar

I'm trying to show a simple Flyout (with informational content) when a AppBarToggleButton within BottomAppBar is pressed, but my solution doesn't work. :(
This is my code:
<Page.BottomAppBar>
<CommandBar>
<AppBarToggleButton x:Uid="MapPageAppBarLegend" Label="" Icon="List">
<FlyoutBase.AttachedFlyout>
<Flyout>
<TextBlock Text="Informations here..."/>
</Flyout>
</FlyoutBase.AttachedFlyout>
</AppBarToggleButton>
</CommandBar>
</Page.BottomAppBar>
Nothing appears.. Can anyone help me to showing this flayout?
Thank you very much and sorry for my english language. :)
Pame
Everything is quite clearly described at MSDN (there is also a very good example there):
Nothing appears, because Flyouts open automatically only for buttons (and AppBarToggleButton doesn't derive from Button class):
A flyout attached to a button opens automatically when the user clicks the button. You don't need to handle any events to open the flyout. (This includes controls derived from Button, like AppBarButton
Of course you can add a Flyout to any FrameworkElement but you will have to open it manually:
You can attach a Flyout control to any FrameworkElement object by using the FlyoutBase.AttachedFlyout attached property. If you do so, you must respond to an interaction on the FrameworkElement, such as the Tapped event, and open the Flyout in your code.
In XAML - define your Flyout in Resources and attach it to button:
<Page.Resources>
<Flyout x:Key="myFlyout" Placement="Top">
<TextBlock Text="Informations here..."/>
</Flyout>
</Page.Resources>
<Page.BottomAppBar>
<CommandBar>
<AppBarToggleButton x:Uid="MapPageAppBarLegend" Label="First" Icon="List"
FlyoutBase.AttachedFlyout="{StaticResource myFlyout}"
Click="AppBarToggleButton_Click"/>
</CommandBar>
</Page.BottomAppBar>
And event in code behind:
private void AppBarToggleButton_Click(object sender, RoutedEventArgs e)
{
FlyoutBase.ShowAttachedFlyout((FrameworkElement)sender);
}

Categories