We Keep Coding

Pop-up content after clicking on an item from the wpf list

I need to implement this drop-down menu in WPF:
When you click on the number of the question, it should open additional content. I can't attach the code, because there is not even an approximate implementation. I tried to implement via Grid.Row and Grid.Column, ListBox, StackPanel but I just didn't have enough knowledge.
Here is the code I've tried:
<Grid>
<ListBox HorizontalContentAlignment="Left">
<Button Content="1"/>
<TextBlock Text="Content"/>
<Button Content="2"/>
</ListBox>
</Grid>

Step 1: Add a User Control to your project.
Step 2: Name it Arrow.
Step 3: This Control will act as a drop-down arrow for us. Add the following XAML code to the control:
<UserControl x:Class="Question_Builder_App.Controls.Arrow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
mc:Ignorable="d">
<Grid>
<Border BorderThickness="0,0,5,0" Height="15" BorderBrush="Black" RenderTransformOrigin="0.5,0.5" Width="10" Margin="0,0,0,10">
<Border.RenderTransform>
<TransformGroup>
<ScaleTransform/>
<SkewTransform/>
<RotateTransform Angle="135"/>
<TranslateTransform/>
</TransformGroup>
</Border.RenderTransform>
</Border>
<Border BorderThickness="0,0,5,0" BorderBrush="Black" RenderTransformOrigin="0.5,0.5" Height="15" Width="10" Margin="0,11,0,0" Grid.RowSpan="2">
<Border.RenderTransform>
<TransformGroup>
<ScaleTransform/>
<SkewTransform/>
<RotateTransform Angle="225"/>
<TranslateTransform/>
</TransformGroup>
</Border.RenderTransform>
</Border>
</Grid>
The control should look like this:
Step 4: Add the following XAML to your MainWindow:
<Window x:Class="Question_Builder_App.MainWindow"
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"
Title="MainWindow" Height="450" Width="800" Background="#FF283246">
<Grid x:Name="MainGrid">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<StackPanel x:Name="LeftPanel" Grid.Column="0">
<Border CornerRadius="10,10,10,10" HorizontalAlignment="Center" VerticalAlignment="Center" Background="#FF033B50" Margin="50,20,50,0">
<Button x:Name="AddQuestion_BTN" FontSize="24" Content="+" HorizontalAlignment="Stretch" VerticalAlignment="Center" Foreground="White" HorizontalContentAlignment="Left" Padding="10,0,10,0" Click="AddQuestion_BTN_Click" Background="{x:Null}" BorderBrush="{x:Null}"/>
</Border>
</StackPanel>
<Frame x:Name="RightPanel" Grid.Column="1" NavigationUIVisibility="Hidden"/>
</Grid>
The designer should look like this:
Step 5: Now lets add some C# codes to our MainWindow:
using System.Collections.ObjectModel;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Media;
namespace Question_Builder_App
{
/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
AddSampleData("Test Button 1", "Test Button");
AddSampleData("Test Button 2", "Test Button");
AddSampleData("Test Button 3", "Test Button");
}
private int ButtonCount = 0;
private ObservableCollection<DataModel> PageCollection = new ObservableCollection<DataModel>();
private class DataModel
{
public string MainButtonName { get; set; }
public string PageName { get; set; }
public Page DisplayPage { get; set; }
}
private static string CreateInputWindow(string WindowDescription)
{
Window ButtonInfoWindow = new Window();
ButtonInfoWindow.Background = null; ButtonInfoWindow.SizeToContent = SizeToContent.WidthAndHeight;
StackPanel SP = new StackPanel();
Border TextDescription = AddBorder(WindowDescription, 24);
TextBox TB = new TextBox();
TB.MinWidth = 100; TB.FontSize = 24;
Button B = new Button();
B.FontSize = 24; B.Margin = new Thickness(0, 10, 0, 0); B.Content = "Set";
B.Click += delegate { ButtonInfoWindow.Close(); };
SP.Children.Add(TextDescription); SP.Children.Add(TB); SP.Children.Add(B);
ButtonInfoWindow.Content = SP;
ButtonInfoWindow.ShowDialog();
return TB.Text;
}
private void AddQuestion_BTN_Click(object sender, RoutedEventArgs e)
{
Border TopBorder = new Border();
TopBorder.CornerRadius = new CornerRadius(10); TopBorder.Background = new SolidColorBrush(Color.FromRgb(3, 59, 80)); TopBorder.HorizontalAlignment = HorizontalAlignment.Left;
TopBorder.Margin = new Thickness(40, 20, 40, 0);
StackPanel TopSPPanel = new StackPanel();
TopBorder.Child = TopSPPanel;
StackPanel LowerPanel = new StackPanel();
LowerPanel.Visibility = Visibility.Collapsed;
string MainButtonName = CreateInputWindow("What is the name of the button you wish to create?");
Border NewQuestion_BTN = AddBorder(ButtonCount + 1 + ". " + MainButtonName, 24);
NewQuestion_BTN.MouseLeftButtonDown += delegate
{
if (LowerPanel.Visibility == Visibility.Visible)
{
LowerPanel.Visibility = Visibility.Collapsed;
NewQuestion_BTN.Background = new SolidColorBrush(Color.FromRgb(3, 59, 80));
}
else
{
LowerPanel.Visibility = Visibility.Visible;
NewQuestion_BTN.Background = new SolidColorBrush(Colors.Blue);
}
};
TopSPPanel.Children.Add(NewQuestion_BTN);
LowerPanel.Margin = new Thickness(0, 10, 0, 10);
Border LowerNewQuestion_BTN = AddBorder("+", 24);
LowerNewQuestion_BTN.MouseLeftButtonDown += delegate
{
string InputText = CreateInputWindow("What is the name of the button you wish to create?");
Border ChooseQuestionBTN = AddBorder(LowerPanel.Children.Count + ". " + InputText, 16);
ChooseQuestionBTN.MouseLeftButtonDown += delegate
{
UncheckAllButtons();
ChooseQuestionBTN.Background = new SolidColorBrush(Colors.Aquamarine);
NavigateToPage(MainButtonName, InputText);
};
LowerPanel.Children.Insert(LowerPanel.Children.Count - 1, ChooseQuestionBTN);
};
LowerPanel.Children.Add(LowerNewQuestion_BTN); TopSPPanel.Children.Add(LowerPanel);
LeftPanel.Children.Insert(ButtonCount, TopBorder);
ButtonCount++;
}
private void NavigateToPage(string MainButtonText, string NameChecker)
{
bool CheckIfToADDANewPage = true;
foreach (DataModel PageFinder in PageCollection)
{
if (PageFinder.PageName == NameChecker && PageFinder.MainButtonName == MainButtonText)
{
RightPanel.Navigate(PageFinder.DisplayPage);
CheckIfToADDANewPage = false;
}
}
if (CheckIfToADDANewPage == true)
{
DataModel SavePage = new DataModel();
SavePage.MainButtonName = MainButtonText; SavePage.PageName = NameChecker; SavePage.DisplayPage = CreateANewPage();
PageCollection.Add(SavePage);
RightPanel.Navigate(SavePage.DisplayPage);
}
}
private static Page CreateANewPage()
{
Page QuestionPage = new Page();
StackPanel QuestionPanel = new StackPanel();
Border QuestionBorder = AddBorder("+", 24);
QuestionBorder.Margin = new Thickness(5, 20, 0, 0); QuestionBorder.Background = new SolidColorBrush(Colors.Aqua);
QuestionBorder.MouseLeftButtonDown += delegate
{
StackPanel UpperQuestionPanel = new StackPanel(); UpperQuestionPanel.Orientation = Orientation.Horizontal;
UpperQuestionPanel.Margin = new Thickness(0, 20, 0, 0);
Border QuestionNumberTXT = AddBorder(QuestionPanel.Children.Count.ToString(), 24);
QuestionNumberTXT.VerticalAlignment = VerticalAlignment.Top; QuestionNumberTXT.Background = new SolidColorBrush(Colors.Aqua);
Controls.Arrow PanelArrow = new Controls.Arrow();
PanelArrow.Margin = new Thickness(20, 10, 10, 0); PanelArrow.VerticalAlignment = VerticalAlignment.Top;
StackPanel InnerQuestionPanel = new StackPanel(); InnerQuestionPanel.Visibility = Visibility.Collapsed; InnerQuestionPanel.Margin = new Thickness(0, 10, 10, 0);
PanelArrow.MouseLeftButtonDown += delegate
{
if (InnerQuestionPanel.Visibility == Visibility.Collapsed)
{
InnerQuestionPanel.Visibility = Visibility.Visible;
PanelArrow.RenderTransform = new RotateTransform(90);
PanelArrow.Margin = new Thickness(45, 20, 10, 0);
if (InnerQuestionPanel.ActualWidth < 1)
{
Border InnerQuestionBorder = AddBorder(CreateInputWindow("Please enter description of the question: "), 24);
InnerQuestionBorder.MaxWidth = 800;
InnerQuestionPanel.Children.Insert(0, InnerQuestionBorder);
}
}
else
{
InnerQuestionPanel.Visibility = Visibility.Collapsed;
PanelArrow.RenderTransform = new RotateTransform(0);
PanelArrow.Margin = new Thickness(20, 10, 10, 0);
}
};
WrapPanel NewQuestionWrapPanel = new WrapPanel();
NewQuestionWrapPanel.Orientation = Orientation.Horizontal;
Border AddNewQuestionBTN = AddBorder("+", 24);
AddNewQuestionBTN.Margin = new Thickness(10, 10, 0, 0);
AddNewQuestionBTN.MouseLeftButtonDown += delegate
{
NewQuestionWrapPanel.MaxWidth = InnerQuestionPanel.ActualWidth;
Border ChooseNewQuestion = AddBorder(CreateInputWindow("Add new question: "), 24);
ChooseNewQuestion.Margin = new Thickness(10, 10, 0, 0);
NewQuestionWrapPanel.Children.Insert(NewQuestionWrapPanel.Children.Count - 1, ChooseNewQuestion);
};
NewQuestionWrapPanel.Children.Insert(NewQuestionWrapPanel.Children.Count, AddNewQuestionBTN); InnerQuestionPanel.Children.Add(NewQuestionWrapPanel);
UpperQuestionPanel.Children.Add(QuestionNumberTXT); UpperQuestionPanel.Children.Add(PanelArrow); UpperQuestionPanel.Children.Add(InnerQuestionPanel);
QuestionPanel.Children.Insert(QuestionPanel.Children.Count - 1, UpperQuestionPanel);
};
QuestionPanel.Children.Insert(QuestionPanel.Children.Count, QuestionBorder); QuestionPage.Content = QuestionPanel;
return QuestionPage;
}
private static Border AddBorder(string InnerText, int SetFontSize)
{
Border NewBorder = new Border();
NewBorder.CornerRadius = new CornerRadius(10); NewBorder.Background = new SolidColorBrush(Color.FromRgb(3, 59, 80)); NewBorder.HorizontalAlignment = HorizontalAlignment.Left;
NewBorder.Margin = new Thickness(10, 0, 10, 0);
TextBlock NewButton = new TextBlock();
NewButton.FontSize = SetFontSize; NewButton.VerticalAlignment = VerticalAlignment.Stretch; NewButton.Foreground = new SolidColorBrush(Colors.White);
NewButton.Margin = new Thickness(10, 0, 10, 0);
NewButton.Text = InnerText;
NewButton.TextWrapping = TextWrapping.Wrap;
NewBorder.Child = NewButton;
return NewBorder;
}
private void AddSampleData(string MainButtonText, string SecondaryButtonText)
{
Border TopBorder = new Border();
TopBorder.CornerRadius = new CornerRadius(10); TopBorder.Background = new SolidColorBrush(Color.FromRgb(3, 59, 80)); TopBorder.HorizontalAlignment = HorizontalAlignment.Left;
TopBorder.Margin = new Thickness(40, 20, 40, 0);
StackPanel TopSPPanel = new StackPanel();
TopBorder.Child = TopSPPanel;
StackPanel LowerPanel = new StackPanel();
LowerPanel.Visibility = Visibility.Collapsed;
Border NewQuestion_BTN = AddBorder(ButtonCount + 1 + ". " + MainButtonText, 24);
NewQuestion_BTN.MouseLeftButtonDown += delegate
{
if (LowerPanel.Visibility == Visibility.Visible)
{
LowerPanel.Visibility = Visibility.Collapsed;
NewQuestion_BTN.Background = new SolidColorBrush(Color.FromRgb(3, 59, 80));
}
else
{
LowerPanel.Visibility = Visibility.Visible;
NewQuestion_BTN.Background = new SolidColorBrush(Colors.Blue);
}
};
TopSPPanel.Children.Add(NewQuestion_BTN);
LowerPanel.Margin = new Thickness(0, 10, 0, 10);
Border LowerNewQuestion_BTN = AddBorder("+", 24);
LowerNewQuestion_BTN.MouseLeftButtonDown += delegate
{
string InputText = CreateInputWindow("What is the name of the button you wish to create?");
Border ChooseQuestionBTN = AddBorder(LowerPanel.Children.Count + ". " + InputText, 16);
ChooseQuestionBTN.MouseLeftButtonDown += delegate
{
UncheckAllButtons();
ChooseQuestionBTN.Background = new SolidColorBrush(Colors.Aquamarine);
NavigateToPage(MainButtonText, InputText);
};
LowerPanel.Children.Insert(LowerPanel.Children.Count - 1, ChooseQuestionBTN);
};
Border SampleQuestionBTN = AddBorder(LowerPanel.Children.Count + 1 + ". " + SecondaryButtonText, 16);
SampleQuestionBTN.MouseLeftButtonDown += delegate
{
UncheckAllButtons();
SampleQuestionBTN.Background = new SolidColorBrush(Colors.Aquamarine);
NavigateToPage(MainButtonText, SecondaryButtonText);
};
LowerPanel.Children.Insert(LowerPanel.Children.Count, SampleQuestionBTN);
LowerPanel.Children.Add(LowerNewQuestion_BTN); TopSPPanel.Children.Add(LowerPanel);
LeftPanel.Children.Insert(ButtonCount, TopBorder);
ButtonCount++;
}
private void UncheckAllButtons()
{
foreach (Border _BR in LeftPanel.Children)
{
if (_BR.Child is StackPanel)
{
StackPanel SP = (StackPanel)_BR.Child;
foreach (UIElement UE in SP.Children)
{
if (UE is StackPanel)
{
StackPanel SP1 = (StackPanel)UE;
foreach (Border B in SP1.Children)
{
B.Background = null;
}
}
}
}
}
}
}
}

C# XCeed creating PropertyGrid dynamically by code

I'm trying to create the PropertyGrid dynamically in code. So far, I can create and customize a PropertyGrid inside the XAML credits to: XCeed PropertyGrid customizing IntegerUpDown
:
MainWindow.xaml.cs:
public MainWindow()
{
InitializeComponent();
Sample or = new Sample();
pg.SelectedObject = or;
pg.ShowAdvancedOptions = true;
EditorDefinition ed = new EditorDefinition();
PropertyDefinition pd = new PropertyDefinition();
pd.Name = "Value";
ed.PropertyDefinitions.Add(pd);
DataTemplate dt = new DataTemplate();
FrameworkElementFactory fac = new FrameworkElementFactory(typeof(PropertyGridEditorIntegerUpDown));
dt.VisualTree = fac;
DependencyProperty dp = PropertyGridEditorIntegerUpDown.DefaultValueProperty;
fac.SetValue(dp, 10);
ed.EditorTemplate = dt;
pg.EditorDefinitions.Add(ed);
}
MainWindow.xaml:
<Window
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:local="clr-namespace:WpfApp1"
xmlns:xctk="http://schemas.xceed.com/wpf/xaml/toolkit" xmlns:xcdg="http://schemas.xceed.com/wpf/xaml/datagrid" x:Class="WpfApp1.MainWindow"
mc:Ignorable="d"
Title="MainWindow" Height="450" Width="800">
<xctk:PropertyGrid x:Name="pg">
<xctk:PropertyGrid.EditorDefinitions >
<xctk:EditorDefinition >
<xctk:EditorDefinition.PropertiesDefinitions >
< xctk:PropertyDefinition Name = "Value" />
</xctk:EditorDefinition.PropertiesDefinitions >
<xctk:EditorDefinition.EditorTemplate >
<DataTemplate >
<xctk:PropertyGridEditorIntegerUpDown Increment = "10" Value = "{Binding Value}" Maximum = "40" MinHeight = "0" Minimum = "-30" />
</DataTemplate >
</xctk:EditorDefinition.EditorTemplate >
</xctk:EditorDefinition >
</xctk:PropertyGrid.EditorDefinitions >
</xctk:PropertyGrid >
</Window>
and the Sample class:
public class Sample
{
private int _Value;
#region Public Properties
[Category("Sample")]
[DisplayName("Sample Value")]
[DefaultValue(3)]
public int Value { set; get; }
#endregion
}

This would be the equivalent code:
EditorDefinition ed = new EditorDefinition();
PropertyDefinition pd = new PropertyDefinition();
pd.Name = "Value";
ed.PropertiesDefinitions.Add(pd);
FrameworkElementFactory fac = new FrameworkElementFactory(typeof(PropertyGridEditorIntegerUpDown));
fac.SetBinding(PropertyGridEditorIntegerUpDown.ValueProperty, new Binding("Value"));
fac.SetValue(PropertyGridEditorIntegerUpDown.IncrementProperty, 10);
DataTemplate dt = new DataTemplate { VisualTree = fac };
dt.Seal();
ed.EditorTemplate = dt;
pg.EditorDefinitions.Add(ed);

Silverlight grid not filling entire space

I have content object in wcf.
I try store in content property grid but it not fill the entire length.
Function return grid:
private Grid ChangeContentObject()
{
Grid g = new Grid();
g.Background = new SolidColorBrush(Colors.Red);
g.HorizontalAlignment = HorizontalAlignment.Stretch;
g.VerticalAlignment = VerticalAlignment.Stretch;
ColumnDefinition columnDefinitionForPath = new ColumnDefinition();
columnDefinitionForPath.Width = new GridLength(4,GridUnitType.Star);
ColumnDefinition columnDefinitionForEmpty = new ColumnDefinition();
columnDefinitionForEmpty.Width = new GridLength(6, GridUnitType.Star);
g.ColumnDefinitions.Add(columnDefinitionForPath);
g.ColumnDefinitions.Add(columnDefinitionForEmpty);
WindowsShapes.Path p = new WindowsShapes.Path();
p.Stroke = new SolidColorBrush(Colors.Brown);
p.StrokeThickness = 2;
p.HorizontalAlignment = HorizontalAlignment.Stretch;
var b = new Binding
{
Source = "M50,0 L0,0 L0,50 L50,50"
};
BindingOperations.SetBinding(p, WindowsShapes.Path.DataProperty, b);
p.Stretch = Stretch.Fill;
g.Children.Add(p);
Grid.SetColumn(p, 0);
return g;
}
Code for set content:
objectVisual.Content = ChangeContentObject();
objectVisual property:
objectVisual.VerticalAlignment = Stretch
objectVisual.VerticalAlignment
objectVisual.Width = 100
objectVisual.Height = 50
I get next result:
Why grid does not fill the entire length?

Your Grid has 2 columns. The second column is empty, and therefore collapsed, so you can't see it. Binding something to it solves the "problem". Also, modified your Path data for this demo, because the one you had is no good. Take a look:
private Grid ChangeContentObject()
{
Grid g = new Grid();
g.Background = new SolidColorBrush(Colors.Red);
g.HorizontalAlignment = HorizontalAlignment.Stretch;
g.VerticalAlignment = VerticalAlignment.Stretch;
// add grid line to show columns border
g.ShowGridLines = true;
ColumnDefinition columnDefinitionForPath = new ColumnDefinition();
columnDefinitionForPath.Width = new GridLength(4, GridUnitType.Star);
ColumnDefinition columnDefinitionForEmpty = new ColumnDefinition();
columnDefinitionForEmpty.Width = new GridLength(6, GridUnitType.Star);
g.ColumnDefinitions.Add(columnDefinitionForPath);
g.ColumnDefinitions.Add(columnDefinitionForEmpty);
var p1 = new Path();
p1.Stroke = new SolidColorBrush(Colors.Brown);
p1.StrokeThickness = 2;
p1.Stretch = Stretch.Fill;
p1.HorizontalAlignment = HorizontalAlignment.Stretch;
var b1 = new Binding
{
// modified path data
Source = "M 10,100 C 10,300 300,-200 300,100"
};
BindingOperations.SetBinding(p1, Path.DataProperty, b1);
var p2 = new Path();
p2.Stroke = new SolidColorBrush(Colors.Brown);
p2.StrokeThickness = 2;
p2.Stretch = Stretch.Fill;
p2.HorizontalAlignment = HorizontalAlignment.Stretch;
var b2 = new Binding
{
// modified path data
Source = "M 100,10 C 100,30 -200,100 100,300"
};
BindingOperations.SetBinding(p2, Path.DataProperty, b2);
g.Children.Add(p1);
g.Children.Add(p2);
Grid.SetColumn(p1, 0);
Grid.SetColumn(p2, 1);
return g;
}
Update:
Normally, a Grid would stretch and expand on its own, no need at all to "fill it with empty space". The problem here is caused by the fact that you're placing your Grid enclosed within objectVisual, which apparently is a ContentControl (you didn't make it clear in your post). So, instead you should make objectVisual a type derived from a Panel, like, let's say, another Grid.
And then, replace this:
objectVisual.Content = ChangeContentObject();
with this:
objectVisual.Children.Add(ChangeContentObject());
And you'll get what you want:
Update 2:
Well, your pastebin code is slightly different from your original code, and although that would work too, you misunderstood what I said about the Grid. You don't need your var gridChild, you can keep the second column empty, like in your original question. Notice I commented it out. So, in order to clarify, I am posting full MCVE sample code below. The result looks just like the second image I posted above previously.
UserControl CS:
public partial class SilverlightControl3 : UserControl
{
public SilverlightControl3()
{
InitializeComponent();
}
private void UserControl_Loaded(object sender, RoutedEventArgs e)
{
objectVisual.Children.Add(ChangeContentObject());
}
private Grid ChangeContentObject()
{
Grid g = new Grid();
g.Background = new SolidColorBrush(Colors.Red);
g.HorizontalAlignment = HorizontalAlignment.Stretch;
g.VerticalAlignment = VerticalAlignment.Stretch;
// add grid line to show columns border
g.ShowGridLines = true;
ColumnDefinition columnDefinitionForPath = new ColumnDefinition();
columnDefinitionForPath.Width = new GridLength(4, GridUnitType.Star);
ColumnDefinition columnDefinitionForEmpty = new ColumnDefinition();
columnDefinitionForEmpty.Width = new GridLength(6, GridUnitType.Star);
g.ColumnDefinitions.Add(columnDefinitionForPath);
g.ColumnDefinitions.Add(columnDefinitionForEmpty);
var p1 = new Path();
p1.Stroke = new SolidColorBrush(Colors.Blue);
p1.StrokeThickness = 2;
p1.Stretch = Stretch.Fill;
p1.HorizontalAlignment = HorizontalAlignment.Stretch;
g.Children.Add(p1);
Grid.SetColumn(p1, 0);
var b1 = new Binding
{
Source = "M 10,100 C 10,300 300,-200 300,100"
};
BindingOperations.SetBinding(p1, Path.DataProperty, b1);
// you dont necessarily need this here, you can keep it empty like before
/*
var gridChild = new Grid();
g.Children.Add(gridChild);
Grid.SetColumn(gridChild, 1);
*/
return g;
}
}
UserControl XAML:
<UserControl x:Class="SilverlightApplication4.SilverlightControl3"
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"
d:DesignHeight="300" d:DesignWidth="400" Loaded="UserControl_Loaded">
<Grid x:Name="LayoutRoot" Background="White">
<Grid x:Name="objectVisual" />
</Grid>
</UserControl>
MainWindow:
<UserControl x:Class="SilverlightApplication4.MainPage"
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:local="clr-namespace:SilverlightApplication4"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="400">
<Grid x:Name="LayoutRoot">
<local:SilverlightControl3 />
</Grid>
</UserControl>

WPF C# DockPanel alignment , content got cut off

I have a few information that i want to display inside the DockPanel but , it goes out of line in the DockPanel and some text got cut off like this :
i populate them in code behind , how do i set the dockpanel alignment such that the whole content can be placed inside it without being cut-off .
Heres the xaml code :
<Grid Background="#FF5EC136">
<DockPanel Height="894" HorizontalAlignment="Stretch" Margin="365,135,0,0" Name="dockPanel1" VerticalAlignment="Top" Width="1174" />
</Grid>
i don't know if my xaml.cs will be useful , so i just post it here most of the codes are unrelated tho :
private void PopulateQuestion(int activityID, int taskID)
{
IList<Model.questionhint> lstQuestionHints = qh.GetRecords(taskID, activityID);
StackPanel sp = new StackPanel();
foreach (Model.questionhint qhm in lstQuestionHints)
{
StackPanel sp1 = new StackPanel() { Orientation = Orientation.Horizontal };
TextBlock tb = new TextBlock();
tb.Text = qhm.QuestionContent;
tb.FontWeight = FontWeights.Bold;
tb.FontSize = 24;
sp1.Children.Add(tb);
TextBox tbox = new TextBox();
tbox.Width = 100;
tbox.FontSize = 24;
tbox.FontWeight = FontWeights.Bold;
if (qhm.Option1.Trim().Length > 0 &&
qhm.Option2.Trim().Length > 0)
{
sp1.Children.Add(tbox);
}
Label btn1 = new Label();
Label btn2 = new Label();
if (qhm.Option1.Trim().Length > 0)
{
btn1.Content = qhm.Option1;
btn1.Width = 110;
btn1.FontSize = 24;
btn1.FontWeight = FontWeights.Bold;
btn1.Foreground = (SolidColorBrush)new BrushConverter().ConvertFromString("#FFE22B2B");
sp1.Children.Add(btn1);
btn1.MouseLeftButtonDown += (source, e) =>
{
btn2.Foreground = (SolidColorBrush)new BrushConverter().ConvertFromString("#FFE22B2B");
btn1.Foreground = (SolidColorBrush)new BrushConverter().ConvertFromString("#FFF0FA08");
tbox.Text = btn1.Content.ToString();
};
}
if (qhm.Option2.Trim().Length > 0)
{
btn2.Content = qhm.Option2;
btn2.Width = 110;
btn2.FontSize = 24;
btn2.FontWeight = FontWeights.Bold;
btn2.Foreground = (SolidColorBrush)new BrushConverter().ConvertFromString("#FFE22B2B");
sp1.Children.Add(btn2);
btn2.MouseLeftButtonDown += (source, e) =>
{
btn1.Foreground = (SolidColorBrush)new BrushConverter().ConvertFromString("#FFE22B2B");
btn2.Foreground = (SolidColorBrush)new BrushConverter().ConvertFromString("#FFF0FA08");
tbox.Text =btn2.Content.ToString();
};
}
sp.Children.Add(sp1);
}
dockPanel1.Children.Add(sp);

Use WrapPanel instead of StackPanel. Replace following line in your code
StackPanel sp1 = new StackPanel() { Orientation = Orientation.Horizontal };
with
WrapPanel wp = new WrapPanel();

WP7 Popup in visual tree doesn't respect orientation

I know there are issues with popups and orientation. I've read that if a popup is in the visual tree, it should respect the orientation. I have two types of popups, one global (not in the visual tree) and one that is defined on a specific page xaml. I haven't gotten around to dealing with the global yet, but I was hoping to get the page specific one working.
Here is my xaml:
x:Class="Views.MainPanorama"
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:controls="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"
xmlns:toolkitPrimitives="clr-namespace:Microsoft.Phone.Controls.Primitives;assembly=Microsoft.Phone.Controls.Toolkit"
mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="800"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
SupportedOrientations="PortraitOrLandscape"
shell:SystemTray.IsVisible="False">
<toolkit:TransitionService.NavigationInTransition>
<toolkit:NavigationInTransition>
<toolkit:NavigationInTransition.Backward>
<toolkit:TurnstileTransition Mode="BackwardIn"/>
</toolkit:NavigationInTransition.Backward>
<toolkit:NavigationInTransition.Forward>
<toolkit:TurnstileTransition Mode="ForwardIn"/>
</toolkit:NavigationInTransition.Forward>
</toolkit:NavigationInTransition>
</toolkit:TransitionService.NavigationInTransition>
<toolkit:TransitionService.NavigationOutTransition>
<toolkit:NavigationOutTransition>
<toolkit:NavigationOutTransition.Backward>
<toolkit:TurnstileTransition Mode="BackwardOut"/>
</toolkit:NavigationOutTransition.Backward>
<toolkit:NavigationOutTransition.Forward>
<toolkit:TurnstileTransition Mode="ForwardOut"/>
</toolkit:NavigationOutTransition.Forward>
</toolkit:NavigationOutTransition>
<ScrollViewer x:Name="mainScroll">
<Grid x:Name="LayoutRoot" Style="{StaticResource BackgroundStyle}">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Image x:Name="icon" Source="/Folder;component/Images/Icons/logo.png" Height="24" Width="175" HorizontalAlignment="Left" Margin="20, 15, 0, 0" />
<controls:Panorama Name="panMain" HeaderTemplate="{StaticResource PanoramaHeaderTemplate}" Grid.Row="1" Margin="0, -10, 0, 0" Height="680">
<!--Panorama definition here-->
</controls:Panorama>
<gbl:SecureFooter ShowLock="True" x:Name="panoFoot" Grid.Row="2" VerticalAlignment="Bottom" Margin="24, 24, 24, 0" />
<Popup x:Name="_popup" Grid.Row="3" />
</Grid>
</ScrollViewer>
The page works and the popup appears, but when I rotate the phone or emulator, the contents of the popup don't change orientation.
I'm setting the contents of the popup in code using:
_popup.Child = new OneOfTwoPopupUserControls();
Could this be causing the popup to ignore orientation? Does it need to have the full contents inside it when it's created in the xaml?

If you want to add the Popup to the visual tree, use the following line, the Popup rotates correctly:
LayoutRoot.Children.Add(popupInstance);

From what I understand Popup lives outside the visual tree of the Page, since the Page is what handles the Orientation changes the Popup itself is not affected.
The only solution I've worked with is listening to the orientation changed events and doing my own transform of the popup contents. Not ideal and didn't work well for me. In the end I discarded the Popup.
Sorry I couldn't be more help.

Its actually quite simple to rotate the Popup - or its content to be precise - according to orientation. All you have to do is to listen to Orientation changes ...
static PhoneApplicationFrame ApplicationRootFrame
{
get { return ((PhoneApplicationFrame) Application.Current.RootVisual); }
}
ApplicationRootFrame.OrientationChanged += OnOrientationChanged
And do something like the code below does. The TransformGroup ensures that the Popup content is rotated around the center of the content.
private static void ApplyOrientationTransform(PageOrientation orientation, FrameworkElement popupContent)
{
TransformGroup group;
switch (orientation)
{
case PageOrientation.LandscapeRight:
group = new TransformGroup();
group.Children.Add(new TranslateTransform { X = -popupContent.ActualWidth / 2, Y = -popupContent.ActualHeight / 2 });
group.Children.Add(new RotateTransform {CenterX = 0, CenterY = 0, Angle = -90});
group.Children.Add(new TranslateTransform { X = popupContent.ActualWidth / 2, Y = popupContent.ActualHeight / 2 });
popupContent.RenderTransform = group;
break;
case PageOrientation.LandscapeLeft:
group = new TransformGroup();
group.Children.Add(new TranslateTransform { X = -popupContent.ActualWidth / 2, Y = -popupContent.ActualHeight / 2 });
group.Children.Add(new RotateTransform {CenterX = 0, CenterY = 0, Angle = 90});
group.Children.Add(new TranslateTransform { X = popupContent.ActualWidth / 2, Y = popupContent.ActualHeight / 2 });
popupContent.RenderTransform = group;
break;
default:
popupContent.RenderTransform = null;
break;
}
}

I did originally try the answer as described by Oliver, but found the sizing of the popup needed changing for the information I was trying to display. I cheated a little to complete a similar issue I was having.
Initially I had all of the popup rendering calculated in the showPopup method:
private void showPopup()
{
Session session = App.getSession();
Template template = session.getTemplate();
border.BorderBrush = new SolidColorBrush(Colors.White);
border.BorderThickness = new Thickness(2);
border.Margin = new Thickness(10, 10, 10, 10);
int initialMargin ;
int landMargin ; // margin for information if displayed in landscape orientation
StackPanel stkPnlOuter = new StackPanel();
stkPnlOuter.Background = new SolidColorBrush(Colors.Black);
stkPnlOuter.Orientation = System.Windows.Controls.Orientation.Vertical;
stkPnlOuter.Tap += new EventHandler<System.Windows.Input.GestureEventArgs>(stkPnlOuter_Tap);
if (this.Orientation == PageOrientation.PortraitUp || this.Orientation == PageOrientation.PortraitDown)
{
initialMargin = 0;
landMargin = 0;
}
else
{
initialMargin = 5;
landMargin = 10;
}
TextBlock txt_blk1 = new TextBlock();
txt_blk1.Text = "Loaded Type:";
txt_blk1.TextAlignment = TextAlignment.Left;
txt_blk1.FontSize = 20;
txt_blk1.FontWeight = FontWeights.Bold;
txt_blk1.Margin = new Thickness(5, 5, 5, 5);
txt_blk1.Foreground = new SolidColorBrush(Colors.White);
TextBlock txt_blk2 = new TextBlock();
txt_blk2.Text = template.templateType == TemplateType.TYPE.TEMPLATE_FILE ? "Valido Template File" : "Valido Assessment File";
txt_blk2.TextAlignment = TextAlignment.Left;
txt_blk2.FontSize = 20;
txt_blk2.Margin = new Thickness(5,initialMargin, 5, initialMargin);
txt_blk2.Foreground = new SolidColorBrush(Colors.White);
TextBlock txt_blk3 = new TextBlock();
txt_blk3.Text = "Template Type:";
txt_blk3.TextAlignment = TextAlignment.Left;
txt_blk3.FontSize = 20;
txt_blk3.FontWeight = FontWeights.Bold;
txt_blk3.Margin = new Thickness(5, 10, 5, 5);
txt_blk3.Foreground = new SolidColorBrush(Colors.White);
TextBlock txt_blk4 = new TextBlock();
txt_blk4.Text = TemplateClassification.getName();
txt_blk4.TextAlignment = TextAlignment.Left;
txt_blk4.FontSize = 20;
txt_blk4.Margin = new Thickness(5, landMargin, 5, initialMargin);
txt_blk4.Foreground = new SolidColorBrush(Colors.White);
TextBlock txt_blk5 = new TextBlock();
txt_blk5.Text = "Client Reference:";
txt_blk5.TextAlignment = TextAlignment.Left;
txt_blk5.FontWeight = FontWeights.Bold;
txt_blk5.FontSize = 20;
txt_blk5.Margin = new Thickness(5, 10, 5, 5);
txt_blk5.Foreground = new SolidColorBrush(Colors.White);
TextBlock txt_blk6 = new TextBlock();
txt_blk6.Text = template.ClientRef == null ? "-" : template.ClientRef;
txt_blk6.TextAlignment = TextAlignment.Left;
txt_blk6.FontSize = 20;
txt_blk6.Margin = new Thickness(5, landMargin, 5, initialMargin);
txt_blk6.Foreground = new SolidColorBrush(Colors.White);
TextBlock txt_blk7 = new TextBlock();
txt_blk7.Text = "Template Code:";
txt_blk7.TextAlignment = TextAlignment.Left;
txt_blk7.FontWeight = FontWeights.Bold;
txt_blk7.FontSize = 20;
txt_blk7.Margin = new Thickness(5, 10, 5, 5);
txt_blk7.Foreground = new SolidColorBrush(Colors.White);
TextBlock txt_blk8 = new TextBlock();
txt_blk8.Text = template.Code;
txt_blk8.TextAlignment = TextAlignment.Left;
txt_blk8.FontSize = 20;
txt_blk8.Margin = new Thickness(5, landMargin, 5, initialMargin);
txt_blk8.Foreground = new SolidColorBrush(Colors.White);
TextBlock txt_blk9 = new TextBlock();
txt_blk9.Text = "Template Title:";
txt_blk9.TextAlignment = TextAlignment.Left;
txt_blk9.FontWeight = FontWeights.Bold;
txt_blk9.FontSize = 20;
txt_blk9.Margin = new Thickness(5, 10, 5, 5);
txt_blk9.Foreground = new SolidColorBrush(Colors.White);
TextBlock txt_blk10 = new TextBlock();
txt_blk10.Text = template.Title;
txt_blk10.TextAlignment = TextAlignment.Left;
txt_blk10.FontSize = 20;
txt_blk10.Margin = new Thickness(5, landMargin, 5, initialMargin);
txt_blk10.Foreground = new SolidColorBrush(Colors.White);
TextBlock txt_blk11 = new TextBlock();
txt_blk11.Text = "Modified Date:";
txt_blk11.TextAlignment = TextAlignment.Left;
txt_blk11.FontWeight = FontWeights.Bold;
txt_blk11.FontSize = 20;
txt_blk11.Margin = new Thickness(5, 10, 5, 5);
txt_blk11.Foreground = new SolidColorBrush(Colors.White);
TextBlock txt_blk12 = new TextBlock();
txt_blk12.Text = Valido_CA.modCommon.DateFromString(template.ModifiedDate);
txt_blk12.TextAlignment = TextAlignment.Left;
txt_blk12.FontSize = 20;
txt_blk12.Margin = new Thickness(5, landMargin, 5, 5);
txt_blk12.Foreground = new SolidColorBrush(Colors.White);
if (this.Orientation == PageOrientation.PortraitUp || this.Orientation == PageOrientation.PortraitDown)
{
stkPnlOuter.Children.Add(txt_blk1);
stkPnlOuter.Children.Add(txt_blk2);
stkPnlOuter.Children.Add(txt_blk3);
stkPnlOuter.Children.Add(txt_blk4);
stkPnlOuter.Children.Add(txt_blk5);
stkPnlOuter.Children.Add(txt_blk6);
stkPnlOuter.Children.Add(txt_blk7);
stkPnlOuter.Children.Add(txt_blk8);
stkPnlOuter.Children.Add(txt_blk9);
stkPnlOuter.Children.Add(txt_blk10);
stkPnlOuter.Children.Add(txt_blk11);
stkPnlOuter.Children.Add(txt_blk12);
}
else
{
StackPanel stkPnlLeft = new StackPanel();
stkPnlLeft.Orientation = System.Windows.Controls.Orientation.Vertical;
stkPnlLeft.HorizontalAlignment = System.Windows.HorizontalAlignment.Center;
StackPanel stkPnlRight = new StackPanel();
stkPnlRight.Orientation = System.Windows.Controls.Orientation.Vertical;
stkPnlRight.HorizontalAlignment = System.Windows.HorizontalAlignment.Center;
stkPnlOuter.Orientation = System.Windows.Controls.Orientation.Horizontal;
stkPnlLeft.Children.Add(txt_blk1);
stkPnlRight.Children.Add(txt_blk2);
stkPnlLeft.Children.Add(txt_blk3);
stkPnlRight.Children.Add(txt_blk4);
stkPnlLeft.Children.Add(txt_blk5);
stkPnlRight.Children.Add(txt_blk6);
stkPnlLeft.Children.Add(txt_blk7);
stkPnlRight.Children.Add(txt_blk8);
stkPnlLeft.Children.Add(txt_blk9);
stkPnlRight.Children.Add(txt_blk10);
stkPnlLeft.Children.Add(txt_blk11);
stkPnlRight.Children.Add(txt_blk12);
stkPnlOuter.Children.Add(stkPnlLeft);
stkPnlOuter.Children.Add(stkPnlRight);
}
StackPanel stkPnlInner = new StackPanel();
stkPnlInner.Orientation = System.Windows.Controls.Orientation.Horizontal;
stkPnlInner.HorizontalAlignment = System.Windows.HorizontalAlignment.Center;
Button btn_OK = new Button();
btn_OK.Content = "OK";
btn_OK.Width = 100;
btn_OK.Click += new RoutedEventHandler(btn_OK_Click);
stkPnlInner.Children.Add(btn_OK);
stkPnlInner.HorizontalAlignment = System.Windows.HorizontalAlignment.Center;
stkPnlOuter.Children.Add(stkPnlInner);
border.Child = stkPnlOuter;
if (this.Orientation == PageOrientation.PortraitUp || this.Orientation == PageOrientation.PortraitDown)
{
border.Width = 350;
border.Height = 500;
transforBorder(border);
infoPopup.Child = border;
infoPopup.IsOpen = true;
infoPopup.VerticalOffset = (this.ActualHeight - border.Height) / 2;
infoPopup.HorizontalOffset = (this.ActualWidth - border.Width) / 2;
}
else
{
border.Width = 600;
border.Height = 350;
transforBorder(border);
infoPopup.Child = border;
infoPopup.IsOpen = true;
infoPopup.HorizontalOffset = (this.ActualHeight - border.Width) / 2;
infoPopup.VerticalOffset = (this.ActualWidth - border.Height) / 2;
}
}
then in the OrientationChanged method I used the infoPopup.IsOpen = false, then called the showPopup method again.
Possibly a slightly sloppy way of doing this, but because I needed to change the width and height of the border I found this a simple was to complete the task.