I have a WPF datagrid control as the main content area of my application. What I want is a tab-style button at the bottom center of the application window which floats on top of the grid and retains its position centered in the parent window even when you scroll the grid. The use of this is that I have a lower drawer that I want the user to be able to expand upwards on demand and collapse it again - but they need the little tab always there, docked to the bottom of the window so they can click it to open up the drawer.
How can I do this in WPF?
You could put the DataGrid and the Button in the same Grid:
<Window ...>
<Grid>
<DataGrid x:Name="dg">
</DataGrid>
<Button Content="Button" HorizontalAlignment="Center" VerticalAlignment="Bottom" />
</Grid>
</Window>
This should make the Button always appear at the bottom center and on top of the DataGrid:
Related
I have a ListView wrapped in Grid on top of which I have a panel overlay( How to make overlay control above all other controls?). I would like to highlight a listview item that is under even when the cursor is not directly over it.
I would like to have a highlight like this when the cursor is over the red rectangle.
<Grid Name="grid">
<ListView Name="timeSpansListBox" SelectionMode="Extended" HorizontalAlignment="Left" Width="{Binding ElementName=timePanel, Path=ActualWidth}">
...
</ListView>
<!-- our overlay -->
<MyPanel Name="timePanel" Panel.ZIndex="999">
... items (rectangles you can see on the image)
</MyPanel>
</Grid>
How could I do this?
Similar issue: How to get control with lower zindex when mouse clicked in wpf?
I could set IsHitTestVisible to false but I need panel items to remain clickable so it's not an option.
If only there is some way to set IsMouseOver programmatically...
Set the vertical and horizontal alignment to stretch for the overlay panel
<MyPanel Name="timePanel" Panel.ZIndex="999"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch">
... items (rectangles you can see on the image)
</MyPanel>
In the image here, each block with a number in it represents a laser. These blocks are laid out on a canvas inside a DockPanel. Also inside the DockPanel docked to the top is the red TextBlock that you can see is hiding behind the laser map canvas. Why is this happening? The TextBlock is docked to the top of the DockPanel and canvas has no dock setting, therefore it should fill the rest of space. Also of note: I had to put the DockPanel inside a ViewBox in order for the whole center screen space to scale properly on window resizes. Then I had to put that ViewBox inside a ScrollViewer to allow scroll bars to appear when needed.
Here is the XAML Code for the center screen (Note: Child of the Window is a DockPanel. Menu is docked to the top, left-hand button panel is docked to the left, right-hand button panel is docked to the right, the status bar is docked to the bottom and everything you see in the center screen is defined by the following XAML code)
<ScrollViewer
Name="centerScreenScrollViewer"
VerticalScrollBarVisibility="Auto"
HorizontalScrollBarVisibility="{Binding IsScrollbarsVisible, Converter={StaticResource BoolToScrollbarVisConverter}, FallbackValue=Hidden}">
<Viewbox>
<DockPanel
LastChildFill="True">
<TextBlock
DockPanel.Dock="Top"
Name="tbkFullVisual"
Style="{StaticResource tbkStyleBlue}"
Foreground="Red"
IsEnabled="{Binding FullVisual}"
HorizontalAlignment="Center"
VerticalAlignment="Top"
FontSize="24">
*** This Print Requires Full Visual Inspection! ***
</TextBlock>
<Canvas x:Name="mapCanvas">
<ContentPresenter Content="{Binding MapCanvas}"/>
</Canvas>
</DockPanel>
</Viewbox>
</ScrollViewer>
Any help in solving this issue will be greatly appreciated.
Regards,
Kyle
This has to do with the way that a ViewBox works, in particular with the Canvas element. The ViewBox is used to resize child elements, as I'm sure you're aware. There are 2 issues with the Canvas element:
The default Height and Width are 0, which means that the TextBlock will get all the space.
The Canvas element lets you draw outside of its own boundaries, so even if your canvas is tiny or not even visible, you would be allowed to render your grid of numbers.
The quickest solution is to set VerticalAlignment on the ViewBox:
<Viewbox VerticalAlignment="Top">
...
</Viewbox>
You could set a Height on the Canvas, but I think this is less ideal because you don't want to change this dynamically with window resize.
I have a textbox which is contained in a scrollviewer as below:
<ScrollViewer x:Name="myScrollViewer" Height="200" Width="500" HorizontalAlignment="Left">
<TextBox x:Name="myTextBox" Width="500" TextWrapping="Wrap"/>
</ScrollViewer>
When I input a large number of data in the textbox, the scrollviewer will not scroll down automatically, so this lead I couldn't see what I'm inputing now in the textbox, I have to scroll down manully and see the content which I am inputting. I have two questions:
How to let the scrollbar automatically scroll down follow the line which I am writing now.
TextBox has a border, but if I scroll down, the top border will disappear, it looks like the text box is scroll up, how to make the textbox not changes, the 4 borders always appear and only the content wrapped?
Do you need to use a ScrollViewer, or can you use the TextBox's own scrolling behaviour?
This behaves as you would want in normal Silverlight apps (can't test it on a windows 8 app right atm)
E.G.
<TextBox
Height="200"
Width="500"
TextWrapping="Wrap"
AcceptsReturn="True"
HorizontalScrollBarVisibility="Disabled"
VerticalScrollBarVisibility="Auto"/>
(Note that you don't seem to be able to set the HorizontalScrollBarVisibility and VerticalScrollBarVisibility properties from a Style)
I need to make the ScrollViewer to only scroll down.
I have created a scrollviewer in Xaml and have populated it with a stackpanel full of rectangles in code. I then start the user at the bottom and want them to use a "walking" motion with their fingers (like a bass player) to scroll to the top but do not want them to be able to scroll back to the bottom.
My Xaml looks like this:
<ScrollViewer Height="730" HorizontalAlignment="Left" Margin="6,6,0,0" Name="scrollViewer1" VerticalAlignment="Bottom" Width="462">
<StackPanel Name="TrackStackPanel">
</StackPanel>
</ScrollViewer>
But since it is filled in code, need to accomplish as much as I can in code.
I would try disabling vertical scrolling via VerticalScrollBarVisibility="disabled" - handle the gestures, then scroll accordingly by setting [ScrollToVerticalOffset].
If this does not work, try placing a layer (a Grid for example) above your ScrollViewer, so that it will receive all the gestures, then do as above, scroll via ScrollToVerticalOffset.
I want to be able to align buttons within a stack panel centrally. The number of buttons is dynamic and generated when the control is loaded.
For example, if 1 button is generated then this button should be placed in the center of the control. If 5 buttons are displayed then all 5 should be horizontally aligned next 2 each other but central to the control.
An alternative approach would be to have the control dynamically resize based on its content so it would be wider with more buttons and then horizontally align the user control on the page but I'm not sure how to approach either solution?
Does anybody have any ideas?
This should work. Set the Horizontal Alignment in the stack panel, and make sure when you are dynamically adding your button, you give them each a margin property value to give them some space from each other. horizontal to each other, central to the control.
<StackPanel Orientation="Horizontal" HorizontalAlignment="Center" Margin="20">
<Button Margin="10">one</Button>
<Button Margin="10">two</Button>
<Button Margin="10">three</Button>
<Button Margin="10">four</Button>
<Button Margin="10">five</Button>
</StackPanel>
You can simply set following in XAML
StackPanel.HorizontalAlignment = HorizontalAlignment.Center;
or
HorizontalAlignment="Center" (as GrayFox374 mentioned)
Here is a MSDN sample explaining various alignment operations, having exactly what you need I think -
How to: Horizontally or Vertically Align Content in a StackPanel