How to load user control with scroll bars in WPF? - wpf

I am trying to load a UserControl in the Window by using content control's content property in code behind. Every thing is fine, but my friends were not able to see all the control on the page due to resolution problem. How can I fix this to have scroll bar. I have tried putting ScrollViewer also, but it's not working. So, my solution works on the bigger Window which developed, but its not working on the Smaller resolution windows.
Sample code structure of loading the UserControl:
Window.Xaml
<ScrollViewer>
<ContentControl Name="ContentX" Margin="15,10,15,0" HorizontalAlignment="Center" VerticalAlignment="Center">
<Label FontWeight="Black" FontSize="18" FontFamily="Calibri">Some Content</Label>
</ContentControl>
</ScrollViewer>
Window.Xaml.cs
ContentX.Content = new UserControl();
UserControl.Xaml
//Contains the Code for User Control

I got it solved my Content Control is in another Grid Column where i fixed the width and height to be *, now i removed it it's working fine when i place it inside a Scroll Viewer

Related

wpf controls traveling around the grid/stack panel and not staying put

I am building a user control in WPF and put a few buttons in a stackpanel laying inside a grid. Problem is that when I build the app and run it, the buttons "sail around" and don't stay where I put them in the designer window. Is there any attribute I'm missing(or some sort of container?)?
Thanks.
Try setting the alignment properties of your grid:
<Grid HorizontalAlignment="Left" VerticalAlignment="Top">
...
</Grid>

Embedding a ProgressBar in the TabItem header in WPF

The project I am working on generates a series of tabs for each item opened by the user. For some tabs in particular, certain database hits and calculations take an extended period of time. I was trying to determine a simple way to alert the user when the tab is ready and figured a progress bar would be as good or better than other ways I considered.
I am wondering if there is a way to embed a progress bar behind the header text of a TabItem or if I will need to build my own CustomControl. I have no clue how to do either, however, I think some examples of the latter exist in the project so I could try to figure that out through them.
You can define the layout of a TabItem pretty easily. This snippet of XAML will create a TabControl with one TabItem where the header of the TabItem has a ProgressBar with a TextBlock over the ProgressBar.
Of course, please customize this XAML to actually make it look good :-D
<TabControl>
<TabItem>
<TabItem.Header>
<Grid>
<ProgressBar Width="100" />
<TextBlock Text="Some Tab"/>
</Grid>
</TabItem.Header>
</TabItem>
</TabControl>

Lockable Surface in WPF

I want a custom Control in WPF which have a appearance similar to HTML, we use for showing Images in the centre of the screen with the whole screen locked and only image is showing.
I dont want to show images, I want to show UserControls within this section.
Can someone give suggestions of this?
In your Window, put all your controls in a single Grid, with a Border control (that contains your image) as the last item in the Grid (which means it will display on top of the other items). Toggle its Visibility via binding or code. Adjust styles as required.
<Window>
<Grid>
<!-- window controls go here --->
<Border Visibility="..." Background="#80000000"> <!-- EDITED -->
<!-- overlaid image (and/or other controls) goes here --->
<Image
Source="..."
Width="..."
Height="..."
HorizontalAlignment="Center"
VerticalAlignment="Center" />
</Border>
<Grid>
</Window>
In Windows applications this is generally achieved using a modal dialog, i.e. you create a normal WPF window and show it using ShowDialog.

WPF ListBox scrolls to top when I change status message or show wait screen

I'm developing an opensource application named Media Assistant. I used a ListBox to show the library. ItemsSource is bound to a list of LibraryItem. Here is the XALM.
<ListBox Name="Tree" DockPanel.Dock="Top"
ItemsSource="{Binding DataSource.OrderedLibraryItems}"
Background="{StaticResource LibraryBackground}"
Width="220" HorizontalAlignment="Left"
BorderThickness="0"
VirtualizingStackPanel.IsVirtualizing="True"
VirtualizingStackPanel.VirtualizationMode="Standard"
ScrollViewer.IsDeferredScrollingEnabled="True"
ItemTemplate="{StaticResource ListLibraryItemTemplate}"
SelectionMode="Single"
MouseDoubleClick="HandleMouseDoubleClick"
/>
The problem is when I show any status message at the bottom of my window from a thread by using Dispatcher.
Application.Current.Dispatcher.BeginInvoke(DispatcherPriority.Background,new ParameterizedThreadStart(action), state);
The ListBox scrolls to at the top. If I don't show any status message then it works just fine. The datacontext or list items or focus has not been changed. I could not found any reason why it's doing that. It happens when I display any wait screen which is a non modal window. I could not recreate it in a different project. Here is the source code of Media Assistant.
You can easily re-create it by un-commenting the return statement of method SetStatusMessage at BackgroundScanner class.
I found the reason behind this, so the solution.
I used a DockPanel to layout my UI. I put my status bar at the bottom, the ListBox on the Left and other items are on middle and top. There is a TextBlock in my StatusBar which has width and Height set to Auto. So, when I changed text of my StatusBar TextBlock it's width and height gets recalculated and It's parent's recalculates it's layout. Hence the ListBox gets invoked to Measures and Arrange. Even though it's size does not gets changed it resets it's scroll position to top. It happens only if I use ScrollViewer.CanContentScroll="True" at the ListBox. By default it is True. So, even though I did not set this value It was resetting the scroll position. If I disable it by using ScrollViewer.CanContentScroll="False" then it works fine.
<ListBox Name="Tree" DockPanel.Dock="Top"
ItemsSource="{Binding DataSource.OrderedLibraryItems}"
Background="{StaticResource LibraryBackground}"
Width="220" HorizontalAlignment="Left"
BorderThickness="0"
VirtualizingStackPanel.IsVirtualizing="True"
VirtualizingStackPanel.VirtualizationMode="Standard"
ScrollViewer.IsDeferredScrollingEnabled="True"
ScrollViewer.CanContentScroll="False"
ItemTemplate="{StaticResource ListLibraryItemTemplate}"
SelectionMode="Single"
MouseDoubleClick="HandleMouseDoubleClick"
/>
But setting ScrollViewer.CanContentScroll="False" disables virtualization and I want to use virtualization to my ListBox so I set fixed Height and Width to the TextBlock. So, the DockPanel does not re-arrange it's children if I change the status message.
May be it's a bug at ScrollViewer. It should not change the scroll position if the size has not changed.
In reply to #user904627's answer, here is an enhanced version of his workaround. The issue with just fixing Width and Height is the ListBox keeps the same position even if the user resizes the Window. This is not acceptable.
This is why I created this tiny behavior which fixes Width and Height but listens to the parent element's SizeChanged event to let the ListBox resize itself when the container's size changes.
The code is here: VirtualizedListBoxFixBehavior
When the parent element is resized, I restore Width and Height to double.NaN (so the control can resize itself) and I queue the bit of code which fixes the size properties to actual values in the Dispatcher for later execution.
But this still is an ugly working workaround...
Try this:
listBox1.ScrollIntoView(listBox1.Items.GetItemAt(listBox1.Items.Count - 1));
Since the layout is being reset, it is expected that the list box to select the first item (0).
Can you try to set the selected item to the number of existing items in the list box:
Tree.SelectedIndex = Tree.Items.Count;
I did not test this solution on your code but I have used it in another project of mine where I had a similar problem.
Hope it helps.

Bing Maps in a Listbox boundary issue

Normally the silverlight controls know where they are in terms of who is in front of or behind. An example is putting an image inside a listbox and when you scroll up and down in the listbox, the image will disappear/hide inside the listbox boundaries.
I have put a bing map object(the one that comes with the windows phone 7 sdk) inside a listbox. When I scroll to where the map is in the listbox, it is acting like I have some flag set to "Always on Top". I can't seem to find a property that is setting this or if it's inherent in the way the maps are designed.
I haven't tried this yet, but I'm curious if I add layers with pushpins in them if they too would act "Always on Top". I've included an image to explain. As you can see below, the map is outside of the listbox's bounding area and is even overlapping a button outside of the listbox.
Link to Map Image
<ListBox Height="590">
<TextBlock IsHitTestVisible="False" Foreground="#F80046" Style="{StaticResource PhoneTextExtraLargeStyle}" TextAlignment="Center" Text="Map"></TextBlock>
<my:Map Width="445" x:Name="EventMap" Margin="0,0,0,20" LogoVisibility="Collapsed" CopyrightVisibility="Collapsed">
<my:Map.CredentialsProvider>
<my:ApplicationIdCredentialsProvider ApplicationId="OMITED"></my:ApplicationIdCredentialsProvider>
</my:Map.CredentialsProvider>
</my:Map>
</ListBox>
I'm not sure what you're trying to accomplish, but this seems like more of a usage of ScrollViewer
<ScrollViewer>
<StackPanel>
<my:Map>
</StackPanel>
</ScrollViewer>
rather than ListBox. But anyway, I couldn't reproduce the problem. Does that button have some custom margins that could be doing that?
Here's the solution file I created to see the problem you have in the image. Note that I wasn't able to reproduce it in the solution.
http://dl.dropbox.com/u/129101/WindowsPhoneApplication1.zip

Resources