ScrollViewer Content size change then ScrollToOffset not working - silverlight

I am using a scrollviewer to display an Image within it.
<ScrollViewer Name="scrollViewer1" Height="500" Width="500" HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto" Padding="0" >
<Image x:Name="img1" Width="100" Source="/MyApp;component/Images/Test.jpg" />
</ScrollViewer>
But when I re-size the image in code, and immediately use the scrollViewer.ScrollToHorizontalOffset() (to reposition the image) it does not work :
img1.Width = 1000;
scrollViewer1.ScrollToHorizontalOffset(500);
I verified the ScrollableWidth property after the img1.Width = 1000 indeed it is not updated yet. So I used the UpdateLayout() right after I resize the image, great now the ScrollableWidth is updated :
img1.Width = 1000;
scrollViewer1.UpdateLayout();
scrollViewer1.ScrollToHorizontalOffset(500);
but the ScrollToHorizontalOffset is still not working. If I do it afterwards, on another user button click it works though. :/
Anyone has a clue?

Nevermind... My error, the example above works. In my project I was basing the ScrollToHorizontalOffset on the img1.ActualWidth which was not updated.
Sorry :/

Related

Disable ScrollViewer VerticalScrollBarVisible if content fits

I am currently writing my very first Windows Phone (8) App which also is my very first Xaml Application. So it is likely I just did not find the solution for my problem on my own, because I don't know which words to feed google. I tried, but found nothing useful. I found that one, but it does not help:
How to disable "scroll compression" in ScrollViewer
Here is the important part of my XAML:
<ScrollViewer VerticalScrollBarVisibility="Auto">
<StackPanel VerticalAlignment="Top">
<TextBlock x:Name="InfoText" TextWrapping="Wrap" VerticalAlignment="Top" Text="VersionInfoText"/>
</StackPanel>
</ScrollViewer>
I will programmatically change the content of my TextBlock InfoText. The text might be short enough to fit in completely, or it might be rather long. That is why I embedded it into a ScrollViewer. (By the way, there will be further Controls added to the StackPanel later.)
The ScrollViewer produces these "overbounce" effects if it cannot scroll any further. That is nice if the text is large, but when there is nothing to scroll I don't want this effect to be visilbe.
I tried VerticelScrollBarVisibility="Disable", which successfully disables the effect. Now my question:
Can I automatically (by XAML-Magic) switch between Auto and Disable depending on the Height of my StackPanel and the Hight of my ScrollViewer?
I was hoping Auto would do the trick, but it does not (tested in the VS2013 Emulator WVGA).
In VS2013 setting VerticalScrollBarVisibility="Auto" worked for me.
Try adding this attribute to your ScrollViewer
VerticalScrollMode="Auto"
Also try disabling the HorizontalScrollMode and HorizontalScrollBarVisiblity attributes.
Let me know if this doesn't work. I will then have to make a sample app to see if I can make that work for you. Right now I am just guessing. Try it.
You could dynamically set the SetVerticalScrollBarVisibility to Disabled depends on your InfoText length in your cs code...
if(InfoText.Length() >n)
{
ScrollViewer.SetVerticalScrollBarVisibility(scrollViewer, ScrollBarVisibility.Auto);
}
else
{
ScrollViewer.SetVerticalScrollBarVisibility(scrollViewer, ScrollBarVisibility.Disabled);
}
You can check if TextBlock height is greater than the height of the ScrollViewer.
In xaml:
<ScrollViewer x:Name="TestScrollViewer">
<TextBlock x:Name="InfoText"
Text="Information"
TextWrapping="Wrap"
VerticalAlignment="Top" />
</ScrollViewer>
In cs:
public MainPage()
{
InitializeComponent();
Loaded += (sender, args) =>
{
TestScrollViewer.IsEnabled = InfoText.ActualHeight > TestScrollViewer.ActualHeight;
// OR
TestScrollViewer.VerticalScrollBarVisibility = InfoText.ActualHeight > TestScrollViewer.ActualHeight
? ScrollBarVisibility.Visible
: ScrollBarVisibility.Disabled;
};
}

How to load user control with scroll bars in 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

Adding a border to image control prevents image from displaying WPF

I have a perplexing problem that makes no sense to me - I am trying to place a border round an image control in WPF. The image control displays an image perfectly (I have loaded through code behind and XAML and both work fine). However when I place a border around the image control the image does not appear at all. This happening with three image controls all with identical config. Does anyone know why this is or how I can fix it? Many thanks, Jeff.
XAML (with border commented out) is below:
<!--<Border BorderBrush="Black" BorderThickness="2" Margin="201,172,618,450" Grid.Column="1">-->
<Image Name="imgFault11" Stretch="Fill" Grid.Column="1" Margin="200,172,619,450">
<!--</Border>-->
You are putting both in Grid.Column="1"
Put the image in the border
Start with no margins
<Border BorderBrush="Black" BorderThickness="2" Grid.Column="1">
<Image Name="imgFault11" Stretch="Fill">
</Border>
You may have to send the border to the Background. Once you add this it overlays the image. Right click the border .. go to order and then choose "Send to Back". The border control is in the toolbox. This is all a little messy though as getting the border to match the image box size takes time to get right and then you have one control on top of another..etc.

Label does not change content

I have WPF app with label MainWindow.xaml:
<Label Grid.Row="1" Margin="0,17,0,16" Name="lblLoadDriver" VerticalAlignment="Center" HorizontalAlignment="Left" Height="10" Width="10"></Label>
In MainWindow.xaml.cs there is code, after button click:
lblLoadDriver.Content = ""+DriverInstance.GetType().ToString();
When i debug, I put the mouse over the value of lblLoadDriver browse under "base" section and see content is AS-I-NEED.. i see the text ok, but it didnt change the text on GUI.
Why is this ? Do i need to refresh gui or something ?
thanks.
Perhaps because of Width="10"?
Also Height="10" is a strange idea.

Flowdocument isnt using the full width/height

I have a FlowDocument which I want to fill the entire width and height of my window. I have tried using the FlowDocumentPageViewer (no luck) and am now using a DocumentPageView. I still can't get it to dock/fill the entire space; it's just sitting in the middle, in the minimum size it can create (does it make sense?)
Here is my code:
public DocumentPageView GetPage()
{
FlowDocumentPageViewer viewer = new FlowDocumentPageViewer();
StreamReader reader = new StreamReader(location);
string data = reader.ReadToEnd();
reader.Close();
string xamlData = HtmlToXamlConverter.ConvertHtmlToXaml(data, true);
FlowDocument result = (FlowDocument)System.Windows.Markup.XamlReader.Load(new MemoryStream(System.Text.UnicodeEncoding.Default.GetBytes(xamlData)));
viewer.Document = result;
viewer.VerticalAlignment = VerticalAlignment.Center;
viewer.HorizontalAlignment = HorizontalAlignment.Center;
DocumentPageView pageView = new DocumentPageView();
pageView.VerticalAlignment = VerticalAlignment.Center;
pageView.HorizontalAlignment = HorizontalAlignment.Center;
pageView.Stretch = System.Windows.Media.Stretch.Uniform;
pageView.PageNumber = 0;
pageView.StretchDirection = StretchDirection.Both;
pageView.DocumentPaginator = ((IDocumentPaginatorSource)result).DocumentPaginator;
return pageView;
}
Please note that this code contains the combination of my two methods but only the DocumentPageView is currently used. This is the Xaml that is created from my HTML source:
<FlowDocument xml:space="preserve" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation">
<Paragraph TextAlignment="center" FontSize="22pt" FontFamily="arial">Test Paragraph</Paragraph>
<Paragraph TextAlignment="center" FontFamily="arial">Test second paragraph</Paragraph>
</FlowDocument>
If I resize the fonts the content is only resized vertically (please note that the stretch direction is set to both). Any ideas?
I had a similar problem with FlowDocumentScrollView, but this solution also seems to work with FlowDocumentPageView:
The FlowDocument is centered because it's PagePadding property is set to auto,auto,auto,auto. Setting PagePadding to 0 fixes this behavior.
<FlowDocumentScrollViewer VerticalScrollBarVisibility="Auto">
<FlowDocument PagePadding="0">
</FlowDocument>
</FlowDocumentScrollViewer>
The following lines are causing your elements to center themselves (which is not the same as stretch):
viewer.VerticalAlignment = VerticalAlignment.Center;
viewer.HorizontalAlignment = HorizontalAlignment.Center;
pageView.VerticalAlignment = VerticalAlignment.Center;
pageView.HorizontalAlignment = HorizontalAlignment.Center;
You can safely remove them, as the default alignment here is Stretch.
If you still want to center the viewer, explicitly define the page size (remember, there are 96 points in an inch, and the Margin and PageSize are set in points):
Width= 96 * 8.5
Height= 96 * 11
Could you specify where and how do you use the result of your GetPage() method? Is it xbap or desktop application?
I'm asking this, because the following document is displayed just perfectly right in Kaxaml:
<Page
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Grid>
<FlowDocumentPageViewer>
<FlowDocument >
<Paragraph TextAlignment="center" FontSize="22pt" FontFamily="arial">Test Paragraph</Paragraph>
<Paragraph TextAlignment="center" FontFamily="arial">Test second paragraph</Paragraph>
</FlowDocument>
</FlowDocumentPageViewer>
</Grid>
</Page>
PS: If it's a desktop application you can always find who causes problems by Snoop tool, form Pete Blois.
Update: Its a desktop application, the getpage() result is posted into a grid which docks/fills perfectly.
<Window x:Class="GreenWebPlayerWPF.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Window1" Height="Auto" Width="Auto" WindowStyle="None" WindowState="Maximized" WindowStartupLocation="CenterScreen" Loaded="Window_Loaded" Closing="Window_Closing">
<Grid Width="Auto" Height="Auto" Name="TransitionContainer" Background="White" Margin="0">
//here the result from GetPage() method is inserted
</Grid>
</Window>
(this comment is written from another account)
#Anvaka: What i mean by perfectly right is that the document should "dock in container" that is the fonts should resize, it should fill the container in height and width. Now that im thinking about it, that may not seem like a proper behaviour for a flowdocument.
When i put the flow document in the container it is centered in middle of parent container (so far so good). but the parent container is not filling out its parent container so when i zoom or change font size, i would like the documentPageView container to grow in width and height, but remain centered.

Resources