how to move a button in WPF - c#

XAML code is below
<Window x:Class="DenemeWpfApplication1.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">
<Grid>
<DockPanel Width="Auto"
VerticalAlignment="Stretch"
Height="Auto"
HorizontalAlignment="Stretch"
Grid.ColumnSpan="1"
Grid.Column="0"
Grid.Row="0"
Margin="0,0,0,0"
Grid.RowSpan="1">
<StackPanel>
<StackPanel.Background>
<LinearGradientBrush>
<GradientStop Color="White" Offset="0" />
<GradientStop Color="DarkKhaki" Offset=".3" />
<GradientStop Color="DarkKhaki" Offset=".7" />
<GradientStop Color="White" Offset="1" />
</LinearGradientBrush>
</StackPanel.Background>
<StackPanel Margin="10">
<Button Name="simpleButton"
Click="simpleButtonClick"
KeyDown="simpleButton_KeyDown">Simple</Button>
<Button Name="cubeButton"
Click="cubeButtonClick">Cube</Button>
</StackPanel>
</StackPanel>
<Viewport3D Name="mainViewport"
ClipToBounds="True">
<Viewport3D.Camera>
<PerspectiveCamera FarPlaneDistance="100"
LookDirection="-11,-10,-9"
UpDirection="0,1,0"
NearPlaneDistance="1"
Position="11,10,9"
FieldOfView="70" />
</Viewport3D.Camera>
<ModelVisual3D>
<ModelVisual3D.Content>
<DirectionalLight Color="White" Direction="-2,-3,-1" />
</ModelVisual3D.Content>
</ModelVisual3D>
</Viewport3D>
</DockPanel>
</Grid>
</Window>
this is inide XAML.cs
private void simpleButton_KeyDown(object sender, KeyEventArgs e)
{
if (e.Key == Key.P) {
//something to move the simpleButton
}
}
I want to move simpleButton when P is pressed from keyboard, but I can't seem to find any method or way to do that.

if animation is not required just do
if (e.Key == Key.P)
{
cubeButton.Margin = new Thickness(60, 50, 50, 60);
}
left,top,right,bottom should be numbers
and you have added keydown event to button so button must be focused in order to receive the keydown event
also look at TranslateTransform in WPF

to move the button within the grid you have to handle the keydown event of the MainWindow, see following example:
private void Grid_KeyDown(object sender, KeyEventArgs e)
{
if (e.Key == Key.P)
{
button1.Margin = new Thickness(2, 2, 2, 2);
}
}
Also if you have not explained how the focus on the active form KeyDown event will not be
recalled.
Bye

You can move it many ways. You could put it on a Canvas control and change its Canvas.Left or Canvas.Top. You could put it inside a Grid and change its Grid.Row or Grid.Column. Probably the most flexible way is to apply a TranslateTransform to it, which will also move it the amount you specify.

Related

White space between menu and window

Using the menu control in a xaml window, I have this annoying white space between the window border and the docking panel.
The menu itself is inside a stackpanel:
<Window x:Class="COZView.Shell"
xmlns:ad="clr-namespace:AvalonDock;assembly=AvalonDock"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:sc="clr-namespace:COZView.StaticContent"
xmlns:ve="clr-namespace:COZView.View_Edit"
Title="COZView" Width="1024" Height="800" Icon="/COZView;component/Images/COZView.png"
Loaded="OnLoaded" IsVisibleChanged="isVisibleChanged" Closing="OnClosing">
<Grid x:Name="ShellRegion">
<StackPanel Height="Auto" Orientation="Vertical">
<Menu x:Name="menu">
<!-- MENU ITEMS REMOVED -->
</Menu>
<Grid x:Name="DockingRegion" >
<ad:DockingManager x:Name="DockManager">
<ad:ResizingPanel>
<ad:DocumentPane Margin="0,0,0,0">
<sc:StartPage Title="Home Page" VerticalContentAlignment="Stretch"
onProjectOpenFail="StartPage_onProjectOpenFail"
onProjectOpenSuccess="StartPage_onProjectOpenSuccess"
onProjectCreateSuccess="StartPage_onProjectCreateSuccess"
onProjectCreateFail="StartPage_onProjectCreateFail"/>
</ad:DocumentPane>
<ad:DockablePane ad:ResizingPanel.ResizeWidth="300" x:Name="ExplorerPane" FontSize="14" FontWeight="Bold">
<sc:AboutTab x:Name="about" Title="About" FontSize="14" FontWeight="Bold"/>
<sc:ProcessExplorer x:Name="pxProcessExplorer" Title="Process Explorer" FontSize="14"/>
<sc:DataExplorer x:Name="adDataExplorer" Title="Data Explorer" FontSize="14"/>
<!--<sc:UREPExplorer x:Name="adUREPExplorer" Title="UREP Custom Navigation" FontSize="14" Visibility="Hidden"/>-->
</ad:DockablePane>
</ad:ResizingPanel>
</ad:DockingManager>
</Grid>
</StackPanel>
</Grid>
How do i remove the white space? Do I have to surrond it in something? Should the menu be in a different container?
Its just the default menu style where Background is defined as
<LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
<LinearGradientBrush.GradientStops>
<GradientStop Color="#FFF6F6F6" Offset="0.25" />
<GradientStop Color="#FFEAE8E8" Offset="0.25" />
<GradientStop Color="#FFDCD9D9" Offset="0.8" />
<GradientStop Color="#FFFFFFFF" Offset="1" />
</LinearGradientBrush.GradientStops>
</LinearGradientBrush>
Define a different background if you dont like the #FFFFFFFF bottom line.

How to show a popup on datagrid button click in wpf c#?

I have a common popup in my wpf window and I have a button in the datagrid as well. What I want is to open the popup when the button is clicked. The popup should be independent to each button click. For example, let's say that I have two rows in the datagrid. When I click on the first button popup should appear,then I do some changes to that popup and close it. Now I click the second button it should open a new popup instead of the changes I made before. I'm using a common popup for this. Please anyone tell me is it possible to handle my requirement with common popup window?
XAML
<Popup x:Name="popUpServer" IsOpen="False" Placement="MousePoint" >
<Border Background="#FFEFF2F3" BorderBrush="Black" BorderThickness="1" Width="229" Height="145">
<StackPanel Orientation="Horizontal" Margin="0,0,0,-17">
<Grid Width="227" Margin="0,0,0,10">
<GroupBox Header="Configuration" HorizontalAlignment="Left" Margin="9,6,-9,0" VerticalAlignment="Top" Height="125" Width="211">
<Grid>
<Label Content="Auto Restart" HorizontalAlignment="Left" Margin="10,6,0,0" VerticalAlignment="Top"/>
<ToggleSwitch:HorizontalToggleSwitch x:Name="tsAutoRestart" HorizontalAlignment="Left" Margin="97,10,0,0" VerticalAlignment="Top" Width="46" ThumbSize="22" Height="21" RenderTransformOrigin="3.522,1.048">
<ToggleSwitch:HorizontalToggleSwitch.UncheckedBackground>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#FFC80000" Offset="1"/>
<GradientStop Color="#FF0A0A0A" Offset="0.853"/>
</LinearGradientBrush>
</ToggleSwitch:HorizontalToggleSwitch.UncheckedBackground>
<ToggleSwitch:HorizontalToggleSwitch.CheckedBackground>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#000000" />
<GradientStop Color="#000000" Offset="1" />
</LinearGradientBrush>
</ToggleSwitch:HorizontalToggleSwitch.CheckedBackground>
<ToggleSwitch:HorizontalToggleSwitch.ThumbBrush>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#FFD6D4D4" />
<GradientStop Color="#FFD6D4D4" Offset="1" />
<GradientStop Color="#FFD6D4D4" Offset="0.02" />
</LinearGradientBrush>
</ToggleSwitch:HorizontalToggleSwitch.ThumbBrush>
</ToggleSwitch:HorizontalToggleSwitch>
<ComboBox x:Name="cbDuration" HorizontalAlignment="Left" VerticalAlignment="Top" Width="92" Margin="97,40,0,0">
<ComboBoxItem Content="30 Minutes"/>
<ComboBoxItem Content="1 Hours"/>
<ComboBoxItem Content="2 Hours"/>
</ComboBox>
<Label Content="After" HorizontalAlignment="Left" VerticalAlignment="Top" Width="83" Margin="9,36,0,0"/>
<Button x:Name="btnApply" Content="Apply" HorizontalAlignment="Left" Margin="125,75,0,0" VerticalAlignment="Top" Width="64" Click="BtnApply_Click"/>
</Grid>
</GroupBox>
</Grid>
</StackPanel>
</Border>
</Popup>
Datagrid
<DataGridTemplateColumn>
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<StackPanel>
<Button x:Name="txtServerInfo" Click="TxtServerInfo_Click" Height="23" Width="28">
<Button.Background>
<ImageBrush ImageSource="img.png"/>
</Button.Background>
</Button>
</StackPanel>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
Code behind file
private void TxtServerInfo_Click(object sender, RoutedEventArgs e)
{
popUpServer.IsOpen = true;
}
If you want to use a common popup means better create a popup in a separate user control.then for a button click you can create a new object for the user control and then open the popup by using the user controls object.then the values inside the popup will be independent of the previous button click.
please try the next solution; combine your popup with the button into a separate user control, in that way you can trigger the popup opening based on the button click, and for each button click there will be it's(button) own popup opened there. When you combine the popup and the button together they will have the same data context, thus you will have no problem to make a binding, from the other hand if you want a different data contexts for these controls you can support the user with two dependency properties form that a combined user control.
I'll glad to help if you will have problems with the code, let me know about that.
Regards.

Finding the x:Name in Xaml from C#

From getting a little help, I managed to make the window only open once, now I want to change the window to a page. When I do this obviously .Show(); and also .Close(); have no extension method.
Now I added a frame to my Generic page (As this will be on all forms):
<Frame x:Name="FrameNavigate" HorizontalAlignment="Left" Height="300" Margin="1296,52,0,0" VerticalAlignment="Top" Width="300" NavigationUIVisibility="Hidden"/>
And I put the x:Name"FrameNavigate" in the XAML. In the code behind the Generic page, I wanted to add this piece of code to open the page up on the frame.
private void btnHelp_Click(object sender, RoutedEventArgs e)
{
if (help != null)
{
help.Close();
help = null;
}
else
{
help = new xamlHelp();
FrameNavigate.Navigate(new xamlHelp());
}
}
But It says that FrameNavigate doesn't exist?
EDIT:
<Style TargetType="{x:Type local:Master}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type local:Master}">
<StackPanel>
<Canvas Height="50" Margin="0,0,0,0" HorizontalAlignment="Stretch" FlowDirection="RightToLeft">
<Canvas.Background>
<LinearGradientBrush EndPoint="0,0" StartPoint="0,1">
<GradientStop Color="#FFB3DDF2" Offset="1.0"/>
<GradientStop Color="#FFD6E9F4" Offset="0.0"/>
</LinearGradientBrush>
</Canvas.Background>
<Button x:Name="btnHelp" Content="Help" Click="btnHelp_Click" Foreground="#FF7E8385" FontFamily="Calibri" FontSize="18" Margin="110,10,0,0" Height="30" Width="70" Style="{x:Null}" BorderBrush="Transparent" Background="Transparent" Cursor="Hand"/>
<GridSplitter Height="30" Width="1" Margin="95,10,0,0" Background="Gray"/>
<Button x:Name="btnSettings" Content="Settings" Foreground="#FF7E8385" FontFamily="Calibri" FontSize="18" Margin="10,10,0,0" Click="btnSettings_Click" Height="30" Width="70" Style="{x:Null}" BorderBrush="Transparent" Background="Transparent" Cursor="Hand"/>
</Canvas>
<Canvas Width="350" Height="850" Margin="0,0,0,0" VerticalAlignment="Stretch" HorizontalAlignment="Left" FlowDirection="RightToLeft" DockPanel.Dock="Bottom">
<Canvas.Background>
<LinearGradientBrush EndPoint="0,0" StartPoint="0,1">
<GradientStop Color="#FFD6E9F4" Offset="1.0"/>
<GradientStop Color="White" Offset="0.0"/>
</LinearGradientBrush>
</Canvas.Background>
<Frame x:Name="FrameNavigate" HorizontalAlignment="Left" Height="300" Margin="1296,52,0,0" VerticalAlignment="Top" Width="300" NavigationUIVisibility="Hidden"/>
</Canvas>
</StackPanel>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
EDIT:
I have this code which has got no errors, but when you click the button nothing appears?
Master master = ((Button)sender).TemplatedParent as Master;
Frame frame = (Frame)master.Template.FindName("FrameNavigate",master);
frame.Navigate(new xamlHelp());
Since Frame exists in ControlTemplate, you can't access it directly like this from code behind.
Ask template to get that for you by using FrameworkTemplate.FindName method.
Also you need to get Master control (obviously to get template of Master control) which you can get via accessing TemplatedParent of sender button.
This is how you need to do it:
Master master = ((Button)sender).TemplatedParent as Master;
Frame frame = (Frame)master.Template.FindName("FrameNavigate", master);
frame.Navigate(new xamlHelp());
UPDATED:
The Navigate(TypeName) method takes a Type object!
Frame frame = (Frame)this.FindName("FrameNavigate");
frame.Navigate(typeof(xamlHelp)); //frame.Navigate(help);
Have a look at:
http://msdn.microsoft.com/en-us/library/windows/apps/windows.ui.xaml.controls.frame.navigate.aspx
and at:
http://msdn.microsoft.com/en-us/library/windows/apps/hh771188.aspx
ps. Note you are not using your help variable in you else code block.

ComboBox avoid popup close

I am trying to make a custom color picker which inherit from ComboBox.
This is the screenshot.
As you can see, it's just a very normal color picker interface.
So far, almost everything is fine except the problem I write in the screenshot.
I can drag the spectrum slider, RGBA sliders and click those 2 buttons without problem.
If I click on empty space inside the ComboBoxItem, the popup disppears, this is also the behavior I need and it works.
Here are the codes of the canvas area.
XAML
<Canvas x:Name="colorPlatte" Width="175" Height="150" Grid.Row="0" Grid.Column="0" Margin="4" MouseLeftButtonDown="colorPlatte_MouseLeftButtonDown" MouseLeftButtonUp="colorPlatte_MouseLeftButtonUp" MouseMove="colorPlatte_MouseMove">
<Rectangle x:Name="ColorShadingRectangle"
Height="{Binding ElementName=colorPlatte, Path=Height}"
Width="{Binding ElementName=colorPlatte, Path=Width}"
Fill="{Binding ElementName=sliderSpectrum, Path=SelectedColor, Converter={StaticResource ColorToSolidBrush}}"/>
<Rectangle x:Name="WhiteGradient" Width="{Binding ElementName=colorPlatte,Path=Width}" Height="{Binding ElementName=colorPlatte,Path=Height}">
<Rectangle.Fill>
<LinearGradientBrush StartPoint="0,0" EndPoint="1,0">
<GradientStop Offset="0" Color="#ffffffff" />
<GradientStop Offset="1" Color="Transparent" />
</LinearGradientBrush>
</Rectangle.Fill>
</Rectangle>
<Rectangle x:Name="BlackGradient" Width="{Binding ElementName=colorPlatte,Path=Width}" Height="{Binding ElementName=colorPlatte,Path=Height}">
<Rectangle.Fill>
<LinearGradientBrush StartPoint="0,1" EndPoint="0, 0">
<GradientStop Offset="0" Color="#ff000000" />
<GradientStop Offset="1" Color="#00000000" />
</LinearGradientBrush>
</Rectangle.Fill>
</Rectangle>
<Canvas x:Name="colorSelector" Width="12" Height="12" IsHitTestVisible="False">
<Ellipse Width="12" Height="12" StrokeThickness="3" Stroke="#FFFFFFFF" IsHitTestVisible="False" />
<Ellipse Width="12" Height="12" StrokeThickness="1" Stroke="#FF000000" IsHitTestVisible="False" />
</Canvas>
</Canvas>
Code-behind related to the canvas
private void colorPlatte_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
Point p = e.GetPosition(colorPlatte);
UpdateColorSelectorPosColor(p);
colorPlatte.CaptureMouse();
}
private void colorPlatte_MouseMove(object sender, MouseEventArgs e)
{
if (e.LeftButton == MouseButtonState.Pressed)
{
Point p = e.GetPosition(colorPlatte);
UpdateColorSelectorPosColor(p);
Mouse.Synchronize();
}
}
private void colorPlatte_MouseLeftButtonUp(object sender, MouseButtonEventArgs e)
{
colorPlatte.ReleaseMouseCapture();
}
So, how should I prevent the popup close after user drags the color selector?
Thanks.
Edit : 12/6
Sorry for not descript my question clearly and miss lead you, the previous screenshot was taken in design mode directly and might ignore too much.
I should not say inherit from ComboBox, the ColorPicker is actually an UserControl, and I place it in baseComboBoxItem(inherit from ComboBoxItem) which under a baseComboBox(inherit from ComboBox)
When user click the ComboBox, only one item in popup(the ColorPicker) for user to choose color.
But if user drag the color selector(please refer to previous screenshot), it cause the ComboBox popup(dropdown?) closed automatically.
My question is how should I do to stay the popup open after user drag the color selector(after user trigger MouseLeftButtonUp event)?
I think that if you want to do that (and use a combobox) you have to set the whole template of the combobox (described here), and in the popup set StayOpen to True.
But, as HighCore commented, you don't really need a combobx.
You should have a ToggleButton, and When it's Checked set the canvas visibility to visible, and when it's not checked set the canvas visibility to collapsed

Scrollviewer blocking events

the thing i am battling today is the scrollviewer, and the fact that it blocks my events.SO..here's some xaml:
<ScrollViewer x:Name="scrollv" Panel.ZIndex="15" Margin="8,65.5,0,22" VerticalScrollBarVisibility="Visible" Height="392.5" Background="White" IsHitTestVisible="False">
<Grid x:Name="listaintrebari" Height="Auto" Width="301.5" HorizontalAlignment="Left" VerticalAlignment="Top" Background="White" >
</Grid>
</ScrollViewer>
So the thing is: on the grid which is inside the scrollviewer i programaticly add the questions UserControl...which incidentaly has a button with a click event.My problem is that i cant manage to click the button..it's like the scrollviewer is acting like an invisible shield to protect the usercontrol and the button from the evil Mouse!
Any help apreciated!
EDIT:(this is my questions Usercontrol)
<UserControl
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:eHelper_v3"
mc:Ignorable="d"
x:Class="eHelper_v3.questions"
x:Name="IntrebareControl" Width="330.641" Margin="0" MouseLeftButtonDown="IntrebareControl_MouseLeftButtonDown"
>
<Grid x:Name="LayoutRoot" ScrollViewer.VerticalScrollBarVisibility="Disabled" Margin="0,0,13,0" Height="90" >
<Rectangle x:Name="rect" Panel.ZIndex="20" Height="90" Stroke="#FF0975A3" >
<Rectangle.Fill>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#1404BFD8" Offset="0.004"/>
<GradientStop Color="#1300A7FF" Offset="0.996"/>
<GradientStop Color="#2B0F82CC" Offset="0.459"/>
</LinearGradientBrush>
</Rectangle.Fill>
</Rectangle>
<Image x:Name="imagine" HorizontalAlignment="Left" Margin="8,8,0,8" Width="126.667" Stretch="Fill" MouseLeftButtonDown="imagine_MouseLeftButtonDown" />
<TextBlock x:Name="textul" Margin="138.667,8,8,22.5" TextWrapping="Wrap" Text="aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa" FontSize="9.333"/>
<Label x:Name="status" Content="Status" Height="22" Margin="127,0,100,0.5" VerticalAlignment="Bottom" FontSize="9.333" Background="#00894848" Foreground="Red"/>
<Button x:Name="raspundeBtn" Content="Raspunde" HorizontalAlignment="Right" Height="18" Margin="0,0,8,4.5" VerticalAlignment="Bottom" Width="50.974" FontSize="9.333" Click="raspundeBtn_Click"/>
</Grid>
REEDITED ...wrong code inserted...kinda sleepy over here
Perhaps, some control ist in front of your button. To click "through" a control you can use
IsHitTestVisible="false"
Can you post your CommentThat ?
#after your edit:
It seems like your RichTextBox and that FlowDocument lies over the Button.
Add your Button as the last child of your Grid.
The user control is handling the left mouse button so the click does not get to the content.
MouseLeftButtonDown="IntrebareControl_MouseLeftButtonDown"
Does that event get raised?
Just in case someone also has problems with the ScrollViewer preventing mouse button events from firing, I solved this by setting a ZIndex for the corresponding UIElement:
<TextBlock Text="Hello World!" Panel.ZIndex="2" MouseLeftButtonUp="TextBlockMouseLeftButtonUp"/>

Categories