Textwrapping issu for a UserControl inside Popup - windows-phone-7

I have a user control that inside has a TextBlock (textmsg), the following is the xaml file
<UserControl x:Class="XXXXX.MyMsgBox"
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"
mc:Ignorable="d"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
d:DesignHeight="400" d:DesignWidth="480">
<Grid x:Name="LayoutRoot" Background="#FF000000">
<StackPanel HorizontalAlignment="Left" Name="stackPanel2" VerticalAlignment="Top" Margin="10">
<TextBlock Margin="10" Name="textmsg" Text="{Binding Path=LocalizedResources.wb_msg, Source={StaticResource LocalizedStrings}}" TextWrapping="Wrap" />
<StackPanel Name="stackPanel1" Orientation="Horizontal">
<Button Width="140" Content="{Binding Path=LocalizedResources.set_wb, Source={StaticResource LocalizedStrings}}" Name="button1" Click="button1_Click" FontSize="22" />
<Button Width="170" Content="{Binding Path=LocalizedResources.default_wb, Source={StaticResource LocalizedStrings}}" Name="button2" FontSize="22" />
<Button Width="140" Content="{Binding Path=LocalizedResources.cancel, Source={StaticResource LocalizedStrings}}" Height="72" Name="button3" FontSize="22" />
</StackPanel>
</StackPanel>
</Grid>
</UserControl>
then in C# I use the following code to display the popup
Popup popup = new Popup();
MyMsgBox mmb = new MyMsgBox(popup);
popup.Height = 400;
popup.VerticalOffset = 328;
popup.HorizontalOffset = 0;
popup.Child = mmb;
popup.IsOpen = true;
but the text inside textmsg isn't wrapped, why ? What is wrong?
Best regards.

You should set the MaxWidth property on the parent (StackPanel) of your TextBlock (textmsg). StackPanel sizes to whatever its content asks for, and gives free reign for the content to ask for anything. Thus, the TextBlock asks for the full width of the text with no wrapping.

Related

Overlap controls with listbox

I'm trying to create a autocompletebox but it keeps moving items in my grid/stackpanel down while I want the listbox to overlap the controls, how can I prevent this from happening? I also want to say that a control may appear above the textbox. Thanks in advance.
XAML:
<Page
x:Class="test.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:test"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:mmppf="using:Microsoft.PlayerFramework"
xmlns:ab="using:AutoCompleteBox"
mc:Ignorable="d">
<Grid Name="rootGrid">
<ScrollViewer Grid.Row="2" Grid.Column="0" x:Name="panelScrollViewer" Height="Auto" VerticalScrollBarVisibility="Auto" HorizontalScrollMode="Disabled" HorizontalAlignment="Stretch" VerticalAlignment="Top" ZoomMode="Disabled" MaxZoomFactor="1" MinZoomFactor="1">
<StackPanel Name="contentPanel" Orientation="Vertical" Margin="20,0" HorizontalAlignment="Stretch">
<mmppf:MediaPlayer Name="player" Background="Black" Margin="0,0,0,40" Height="Auto" Width="Auto" VerticalAlignment="Top" Visibility="Collapsed"/>
<TextBox Name="autocomplete" Grid.Row="1" VerticalAlignment="Top" HorizontalAlignment="Stretch"/>
<ListBox Name="autoCompleteListbox" Grid.Row="0"
ScrollViewer.VerticalScrollBarVisibility="Auto"/>
<StackPanel Name="menuPanel" Orientation="Vertical" HorizontalAlignment="Center">
<!--Contains Rows of stack panels with buttons-->
</StackPanel>
<ProgressRing Name="prLoading" Width="100" Height="100" Margin="50" Foreground="White" Visibility="Collapsed"/>
<Grid Name="cv">
<!--more controls-->
</Grid>
</StackPanel>
</ScrollViewer>
</Grid>
</Page>
NOTE: The autocomplete textbox is a object that will show a listbox under it. Also have I found a workaround but if there is a better way to do it, please suggest.
SOLUTION:
<Page
x:Class="test.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:test"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:mmppf="using:Microsoft.PlayerFramework"
xmlns:ab="using:AutoCompleteBox"
mc:Ignorable="d">
<Grid Name="rootGrid">
<ScrollViewer Grid.Row="1" Grid.Column="0" x:Name="panelScrollViewer" Height="Auto" VerticalScrollBarVisibility="Auto" HorizontalScrollMode="Disabled" HorizontalAlignment="Stretch" VerticalAlignment="Top" ZoomMode="Disabled" MaxZoomFactor="1" MinZoomFactor="1">
<StackPanel Name="contentPanel" Margin="20,0" HorizontalAlignment="Stretch">
<StackPanel Orientation="Vertical" HorizontalAlignment="Center">
<mmppf:MediaPlayer x:Name="player" Background="Black" Margin="0,0,0,40" Height="Auto" Width="Auto" VerticalAlignment="Top" Visibility="Collapsed"/>
<TextBox x:Name="autocomplete" VerticalAlignment="Top" HorizontalAlignment="Stretch"/>
</StackPanel>
<Grid>
<StackPanel Margin="0" Orientation="Vertical" Grid.Row="1">
<StackPanel Name="menuPanel" Orientation="Vertical" HorizontalAlignment="Center">
<!--Contains Rows of stack panels with buttons-->
</StackPanel>
<ProgressRing Name="prLoading" Width="100" Height="100" Margin="50" Foreground="White" Visibility="Collapsed"/>
<Grid Name="cv">
<!--more controls-->
</Grid>
</StackPanel>
<ListBox Name="autoCompleteListbox" Grid.Row="0"
VerticalAlignment="Top"
ScrollViewer.VerticalScrollBarVisibility="Auto"/>
</Grid>
</StackPanel>
</ScrollViewer>
</Grid>
</Page>

How to display all the Listpicker options, although placed at bottom of the page?

ListPicker working good if i placed it in the middle of the page. But as per my requirement i need to place it at the bottom of the page. So when i do it is showing only one option, and the rest are at the bottom of the screen.
How can i made all the options visible?
<phone:PhoneApplicationPage
x:Class="ListPickerDemo.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="768"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
SupportedOrientations="Portrait" Orientation="Portrait"
shell:SystemTray.IsVisible="True">
<!--LayoutRoot is the root grid where all page content is placed-->
<Grid x:Name="LayoutRoot" Background="Transparent">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<!--TitlePanel contains the name of the application and page title-->
<StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
<TextBlock x:Name="ApplicationTitle" Text="MY APPLICATION" Style="{StaticResource PhoneTextNormalStyle}"/>
<TextBlock x:Name="PageTitle" Text="page name" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
</StackPanel>
<!--ContentPanel - place additional content here-->
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
<toolkit:ListPicker x:Name="listpicker1" Margin="-6,522,6,-304">
<toolkit:ListPickerItem Content="India" />
<toolkit:ListPickerItem Content="China" />
<toolkit:ListPickerItem Content="Russia" />
<toolkit:ListPickerItem Content="United States" />
</toolkit:ListPicker>
</Grid>
</Grid>
Put the content page in a ScrollViewer so that the page can be scrolled once the ListPicker is expanded.
I have done it using FullModeItemTemplate by showing the list options in another page.
code:
MainPage.xaml
<toolkit:ListPicker Header="country" x:Name="lp2" FullModeHeader="select country" Margin="35,233,27,45" Grid.Row="2">
<toolkit:ListPicker.ItemTemplate>
<DataTemplate x:Name="dt1">
<StackPanel>
<TextBlock Text="{Binding BindsDirectlyToSource=True}"/>
</StackPanel>
</DataTemplate>
</toolkit:ListPicker.ItemTemplate>
<toolkit:ListPicker.FullModeItemTemplate>
<DataTemplate x:Name="dt2">
<StackPanel>
<TextBlock Text="{Binding BindsDirectlyToSource=True}" FontSize="55" />
</StackPanel>
</DataTemplate>
</toolkit:ListPicker.FullModeItemTemplate>
</toolkit:ListPicker>
MainPage.xaml.cs
namespace ListPickerDemo
{
public partial class MainPage : PhoneApplicationPage
{
String[] Country = { "India","Japan",
"China","United states",
"Australia","Brazil",
"Singapore","Newzealand","South Africa"};
// Constructor
public MainPage()
{
InitializeComponent();
this.lpkCountry.ItemsSource = Country;
this.lp2.ItemsSource = Country;
}
}
}

TimePicker:Silverlight Toolkit error: 'Invalid attribute value controls:LongListSelector for property TargetType'

I am trying to implement the TimePicker in a new WP7 application..
But when i run the application...
There is always an error :
'Invalid attribute value controls:LongListSelector for property TargetType'
Here is my xaml Code
<phone:PhoneApplicationPage
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:controls="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"
mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="800"
x:Class="WindowsPhoneApplication3.NewOrEditCoursePage"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
Orientation="Portrait"
shell:SystemTray.IsVisible="True" >
<!--LayoutRoot is the root grid where all page content is placed-->
<Grid x:Name="LayoutRoot" Background="Transparent">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto" MinHeight="607"/>
</Grid.RowDefinitions>
<!--TitlePanel contains the name of the application and page title-->
<StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
<TextBlock x:Name="ApplicationTitle" Text="" Style="{StaticResource PhoneTextNormalStyle}"/>
<TextBlock x:Name="PageTitle" Text="page name" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
</StackPanel>
<!--ContentPanel - place additional content here-->
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
<StackPanel HorizontalAlignment="Left" Height="450" Margin="8,8,0,0" VerticalAlignment="Top" Width="440">
<StackPanel Orientation="Vertical">
<TextBlock TextWrapping="Wrap" Text="" Margin="0,0,0,5" Foreground="{StaticResource PhoneSubtleBrush}"/>
<TextBox TextWrapping="Wrap" Text="TextBox"/>
</StackPanel>
<controls:TimePicker Header="StartTime" Width="440" Height="100"/>
<controls:TimePicker Header="EndTime" Width="440" Height="100" />
<StackPanel Orientation="Vertical">
<TextBlock TextWrapping="Wrap" Text="Address" Foreground="{StaticResource PhoneSubtleBrush}" />
<TextBox TextWrapping="Wrap" Text="TextBox"/>
</StackPanel>
</StackPanel>
<StackPanel HorizontalAlignment="Left" Height="100" VerticalAlignment="Bottom" Width="400" Margin="36,0,0,8" Orientation="Horizontal">
<Button Content="Submit" HorizontalAlignment="Left" Width="200" Height="80"/>
<Button Content="Cancel" Width="200" Height="80"/>
</StackPanel>
</Grid>
</Grid>
</phone:PhoneApplicationPage>
By the way , i have added the "Microsoft.Phone.Controls.Toolkit.dll"
You posted the wrong XAML. We need the XAML for the Control.
Anyway, the error message means that you attempted to set a Value property on the LongListSelector. The LongListSelector control don't expose such a dependency property, and thus you can't set it.

Scrolling in Usercontrol

I have developed one user control, which has ListBox. when we scrolling it is not happen for me can u tell me what would goes wrong in it?
I have following items,
1.Panorama Page
In side controls:PanoramaItem I have created the instance of usecontrol
<controls:PanoramaItem Header ="Header">
<Grid>
<views:MyUserControlView DataContext="{Binding MyViewModel}" />
</Grid>
</controls:PanoramaItem>
2.MyUserControlView
<UserControl x:Class="UI.Views.RecentFileView"
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:utility="clr-namespace:UI.CommandBehaviours"
mc:Ignorable="d"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
d:DesignHeight="364" d:DesignWidth="245">
<Grid x:Name="LayoutRoot" Height="360">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<ScrollViewer VerticalScrollBarVisibility="Auto">
<ListBox x:Name="RecentFilesListBox" Grid.Row="0" ItemsSource="{Binding RecentFiles}"
utility:CommandService.Command="{Binding ToFileViewCommand}" utility:CommandService.CommandParameter="{Binding SelectedItem, ElementName=RecentFilesListBox}" >
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel x:Name="DataTemplateStackPanel" Orientation="Horizontal">
<Image x:Name="ThumbnailImage" Source="{Binding Path=Thumbnail}" Height="43" Width="43" VerticalAlignment="Top" Margin="10,0,20,0"/>
<StackPanel>
<TextBlock x:Name="FileNameTextBlock" Text="{Binding Path=FileName, Mode=OneWay}" Style="{StaticResource PhoneTextExtraLargeStyle}"/>
<TextBlock x:Name="FileserverNameTextBlock" Text="{Binding Path=FileServerName}" Style="{StaticResource PhoneTextSubtleStyle}"/>
</StackPanel>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</ScrollViewer>
</Grid>
When I am Scrolling Its not working for me..
Assuming you mean vertical scrolling, then the structure you've shown should work OK - although I'm a little bit concerned about where the <ListBox> is in your <UserControl>
Here are two things that should work:
Option 1:
<Panorama>
<PanoramaItem>
<MyUserControl>
</PanoramaItem>
</Panorama>
where MyUserControl is:
<UserControl>
<ScrollViewer>
<StackPanel>
... lots of <TextBlock>s
</StackPanel>
</ScrollViewer>
</UserControl>
or...
Option 2.
<Panorama>
<PanoramaItem>
<MyUserControl>
</PanoramaItem>
</Panorama>
where MyUserControl is:
<UserControl>
<ListBox>
... lots of "items" possibly created inside a <DataTemplate>
<ListBox>
</UserControl>
If you want to put a list of items inside a ScrollViewer, then you might be better off using an ItemsControl instead.
The XAML you posted for your usercontrol isn't valid (it contains an extra </StackPanel>) and has lots more grids than you should need.
Try this:
<ListBox x:Name="MyListBox" ItemsSource="{Binding MyProperty}">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<Image x:Name="MyImage" Source="{Binding MyImageSource}" VerticalAlignment="Center" HorizontalAlignment="Center" />
<StackPanel>
<TextBlock x:Name="Label" Text="{Binding MyLabel}" Style="{StaticResource PhoneTextExtraLargeStyle}"/>
<StackPanel Orientation="Horizontal">
<TextBlock x:Name="ReadOnlyTextBlock" Text="{Binding MyStatus}" Style="{StaticResource PhoneTextSubtleStyle}" />
<TextBlock x:Name="PaidTextBlock" Text="{Binding MyPurchase}" Style="{StaticResource PhoneTextSubtleStyle}" Foreground="Blue"/>
</StackPanel>
</StackPanel>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>

How to fill generated Pivot Elements with data [templates]

Howdy,
I would like to generate in my application several PivotItems in a pivotelement. The generation is proceeding fine, however I don't know how I can apply a template to those Pivot Elements.
I thought I would need to use:
pivotItem.ContentTemplate = (DataTemplate)Ressources["KantinenUebersicht"];
But that is only producing an empty page.
My code in the ressource file looks the following:
inserted my whole ressources File
<.ResourceDictionary
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<DataTemplate x:Key="KantinenTemplate">
<StackPanel VerticalAlignment="Top">
<TextBlock HorizontalAlignment="Left" TextWrapping="Wrap" Text="{Binding name}" FontSize="{StaticResource PhoneFontSizeLarge}" Margin="8,0,0,0" VerticalAlignment="Top"/>
<TextBlock HorizontalAlignment="Left" TextWrapping="Wrap" Text="{Binding entfernung}" Margin="24,0,0,0" FontSize="{StaticResource PhoneFontSizeSmall}" VerticalAlignment="Bottom"/>
</StackPanel>
</DataTemplate>
<DataTemplate x:Key="KantinenUebersicht">
<Grid>
<TextBlock x:Name="KantinenName" FontSize="{StaticResource PhoneFontSizeExtraLarge}" Text="" RenderTransformOrigin="0.566,0.407" Margin="0,0,8,0" Height="55" VerticalAlignment="Top">
<TextBlock.Foreground>
<SolidColorBrush Color="{StaticResource PhoneAccentColor}"/>
</TextBlock.Foreground>
</TextBlock>
<TextBlock x:Name="sdfsdf" HorizontalAlignment="Left" Height="40" Margin="8,59,0,0" TextWrapping="Wrap" Text="TextBlock" VerticalAlignment="Top" Width="196"/>
<TextBlock x:Name="lblGeoefsdfsdffnet" Height="40" Margin="208,59,8,0" TextWrapping="Wrap" Text="TextBlock" VerticalAlignment="Top"/>
</Grid>
</DataTemplate></ResourceDictionary.>
Had to insert . in the first tags...
What you're trying to do is correct.
In your question you have an extra "S" in "Resources" which could be the issue.
If I take the code from your question, I can add it to the page:
<phone:PhoneApplicationPage.Resources>
<DataTemplate x:Key="KantinenUebersicht">
<Grid>
<TextBlock x:Name="KantinenName" FontSize="{StaticResource PhoneFontSizeExtraLarge}" Text="" RenderTransformOrigin="0.566,0.407" Margin="0,0,8,0" Height="55" VerticalAlignment="Top">
<TextBlock.Foreground>
<SolidColorBrush Color="{StaticResource PhoneAccentColor}"/>
</TextBlock.Foreground>
</TextBlock>
<TextBlock x:Name="lblEntfernung" HorizontalAlignment="Left" Height="40" Margin="8,59,0,0" TextWrapping="Wrap" Text="TextBlock" VerticalAlignment="Top" Width="196"/>
<TextBlock x:Name="lblGeoeffnet" Height="40" Margin="208,59,8,0" TextWrapping="Wrap" Text="TextBlock" VerticalAlignment="Top"/>
</Grid>
</DataTemplate>
</phone:PhoneApplicationPage.Resources>
and then use it when creating a new item:
var newItem = new PivotItem { Header = "Added" };
newItem.ContentTemplate = (DataTemplate)Resources["KantinenUebersicht"];
MyPivot.Items.Add(newItem);
Works on my machine (emulator).
Update:
If you want to add the resource to a separate file you can do so like:
ResourceDictionary.xaml:
<ResourceDictionary
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" >
<DataTemplate x:Key="KantinenUebersicht">
<Grid>
<TextBlock x:Name="KantinenName" FontSize="{StaticResource PhoneFontSizeExtraLarge}" Text="" RenderTransformOrigin="0.566,0.407" Margin="0,0,8,0" Height="55" VerticalAlignment="Top">
<TextBlock.Foreground>
<SolidColorBrush Color="{StaticResource PhoneAccentColor}"/>
</TextBlock.Foreground>
</TextBlock>
<TextBlock x:Name="lblEntfernung" HorizontalAlignment="Left" Height="40" Margin="8,59,0,0" TextWrapping="Wrap" Text="TextBlock" VerticalAlignment="Top" Width="196"/>
<TextBlock x:Name="lblGeoeffnet" Height="40" Margin="208,59,8,0" TextWrapping="Wrap" Text="TextBlock" VerticalAlignment="Top"/>
</Grid>
</DataTemplate>
</ResourceDictionary>
Then you must reference this external file in the page which wishes to use this file.
<phone:PhoneApplicationPage.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="\ResourceDictionary.xaml"/>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</phone:PhoneApplicationPage.Resources>

Resources