Listview overlay and highlighting listview items - c#

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>

Related

Always show vertical scrollviewer and always return to top scrollviewer

I have a scrollviewer
XAML:
<ScrollViewer
Name="questionScroll"
Grid.Row="0"
MinHeight="150"
MaxHeight="200"
Margin="5,5,5,5"
HorizontalScrollBarVisibility="Disabled"
HorizontalScrollMode="Disabled"
VerticalScrollBarVisibility="Visible"
VerticalScrollMode="Enabled">
I want the vertical scroll to always be visible and so that the scrollviewer always returns to the top scrollviewer. How do you apply it?
Although I have set VerticalScrollBarVisibility = "Visible", the vertical scrollbar is not always visible if the mouse is not directed to the scrollviewer
This is the design of the ScrollViewer.
Because the scrollbar of the ScrollViewer may occlude the contents of the control.
By default, the scrollbar will be hidden when the scrollbar is not used. After set the VerticalScrollBarVisibility="Visible" it will be smaller instead of disapear after the scrollbar is not used after time.
Best regards.

Add button on top of grid control in WPF

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:

How to clip textblock inside proportional grid?

In a UserControl that's inside a ListBox, I've got a TextBlock with proportional width (Width="*") inside a Grid that I want to take the remaining width of the grid, but whenever I resize the ListBox to a size that would clip that TextBlock's content I get a scroll bar. How can I clip the TextBlock width so that I don't get an horizontal scroll bar? Ideally clipping it with ellipsis.
EDIT: Forgot to mention the ListBox.
The listbox is scrolling because it's default behavior is to have HorizontalScrollBarVisibility to Auto.
Try setting this property to disabled:
<ListBox ScrollViewer.HorizontalScrollBarVisibility="Disabled">
As for clipping to an ellipse, this is more complex. You can clip to an ellipsis quite easily using the Clip property:
<TextBlock Text="Some very long thing that I'm putting in here to clip" Background="Blue">
<TextBlock.Clip>
<EllipseGeometry Center="100,8" RadiusX="100" RadiusY="8" />
</TextBlock.Clip>
</TextBlock>
However, to keep the Center, RadiusX and RadiusY in order you'll have to bind it to the height and width of the text box (perhaps using a converter to half these values).

Stackpanel IsMouseOver is False - when mouse is over the gap between stackPanel Items

I have the following WPF control
And it looks like this when the app is running.
The problem is - that the popup - is Closed when my mouse is between the buttons. (the gap between the U, B & NB buttons)
As You can see - Popup.IsOpen property is bound to the stackPanel - IsMouseOver
How can I solve this ? So that the Popup would be open while my mouse is between the mentioned buttons ? (preferably without any code-behind)
Set the StackPanel to Transparent (or whatever color works for you). For some reason, setting the Background brush (even to Transparent) allows the IsMouseOver to work as you would expect. Likely some WPF magic with layout and rendering optimization.
<Grid>
<StackPanel x:Name="ThePanel" Background="Transparent">
<TextBox Margin="5">WOOT</TextBox>
<TextBox Margin="5">WOOT</TextBox>
<TextBox Margin="5">WOOT</TextBox>
</StackPanel>
<Popup IsOpen="{Binding ElementName=ThePanel, Path=IsMouseOver, Mode=OneWay}">
<!--stuff-->
</Popup>
</Grid>
The default value for the backgound for all panels is null, and when the background is null the touch and mouse events will not work. Set the stackpanel background to transparent or other color.

Canvas improperly overlaying a TextBlock component inside a DockPanel

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.

Categories

Resources