Error adding controls to new RadPane

[Lindsay Miles]

Hello,

I have a RadSplitContainer rsc containing RadPaneGroup rpg containing RadPane rp1.

rp1 contains nested StackPanels which contain various controls - labels, txtboxes etc.

That is all in xaml and all works/displays, no problem.

However, in code, I do something like this (add new RadPane with controls):

Label lbl = new Label();

lbl.Name = "lbl1";

lbl.Content = "Some Label";

StackPanel sp = new StackPanel();

sp.Children.Add(lbl);

Grid grd = new Grid();

grd.Children.Add(sp);

RadPane rp2 = new RadPane();

rp2.Content = grd;

then I add the rp2 to the RadPaneGroup rpg

rpg.Items.Add(rp2)

The panel is displayed in the right place, right order etc etc.

PROBLEM:

My label control is visible on rp1 NOT rp2 but I added it to rp2.Content

The controls (in my full version) are ending up in the wrong RadPane (rp1) and NOT in the pane I am adding them to (rp2) in code!

What might I be doing wrong?

Anyone?

Thanks

[Lindsay Miles]

New Approach.

Built a Template, assigned it to a Style then tried adding a new RadDocumentPane with the Style to the RadPaneGroup.

No controls show in the panes. The panes display as needed, ie: docked and tabbed at the top.

But as one clicks each pane (see I add 3 or 4), none of the panes show any of the controls from the Template/Style.

Code and markup below with the xaml and method to add a pane.

I've tried using a RadPane and a RadDocumentPane to no avail.

If the Grid is commented IN or OUT, no difference.

Combobox items removed for clarity

ANY HELP PLEASE!!!

        <ControlTemplate x:Key="RadPaneTemplate" TargetType="telerikDocking:RadDocumentPane">

            

            <!--Grid Width="600" Height="600" Background="Cyan" -->

                <StackPanel Width="600" Height="600" Orientation="Vertical">

                    <Canvas Height="300" Width="600" MouseLeftButtonDown="canvas1_MouseLeftButtonDown"MouseLeftButtonUp="canvas1_MouseLeftButtonUp" MouseMove="canvas1_MouseMove" Margin="0,0,0,0">

                        <Image Margin="0,0,0,0"Source="/MyApp;component/Images/pngs/test.png"></Image>

                    </Canvas>

                    <Canvas Height="300" Width="600">

                        <StackPanel Height="300" Width="600" Orientation="Vertical" >

                            <StackPanel Height="25" Width="597" Orientation="Horizontal"Margin="4,0,0,0" HorizontalAlignment="Left">

                                <StackPanel Orientation="Horizontal" Width="175"HorizontalAlignment="Left" VerticalAlignment="Stretch" Margin="0,3,0,0">

                                    <dataInput:Label Content="Dgrm Type:" Height="25"Width="70"></dataInput:Label>

                                    <ComboBox Width="100"></ComboBox>

                                </StackPanel>

                                <StackPanel Orientation="Horizontal" Width="220"HorizontalAlignment="Left" VerticalAlignment="Stretch" Margin="0,3,0,0">

                                    <dataInput:Label Content="Dgrm Focus:" Height="25"Width="70"></dataInput:Label>

                                    <ComboBox Width="138"></ComboBox>

                                </StackPanel>

                                <StackPanel Orientation="Horizontal" Width="200"HorizontalAlignment="Left" VerticalAlignment="Stretch" Margin="0,3,0,0">

                                    <dataInput:Label Content="Sequence:" Height="25" Width="115" ></dataInput:Label>

                                    <ComboBox Width="85"></ComboBox>

                                </StackPanel>

                            </StackPanel>

                            <StackPanel Height="25" Width="370" Orientation="Horizontal"Margin="4,3,0,0" HorizontalAlignment="Left">

                                <dataInput:Label Content="Dgrm Title:" Height="25" Width="70"HorizontalAlignment="Left"></dataInput:Label>

                                <TextBox Width="295" HorizontalAlignment="Left"></TextBox>

                            </StackPanel>

                            <StackPanel Orientation="Horizontal" Width="600" Height="240">

                                <StackPanel Height="235" Width="297" Orientation="Vertical">

                                    <dataInput:Label Content="Dgrm Notes:" Height="25"Margin="4,0,0,0"></dataInput:Label>

                                    <TextBox Height="200" Margin="4,0,0,0" AcceptsReturn="True"VerticalScrollBarVisibility="Auto"></TextBox>

                                </StackPanel>

                                <StackPanel Height="235" Width="297" Orientation="Vertical">

                                    <dataInput:Label Content="Dgrm Description:" Height="25"Margin="4,0,0,0"></dataInput:Label>

                                    <TextBox Height="200" Margin="4,0,0,0" AcceptsReturn="True"VerticalScrollBarVisibility="Auto"></TextBox>

                                </StackPanel>

                            </StackPanel>

                        </StackPanel>

                    </Canvas>

                </StackPanel>

            <!-- /Grid -->

        </ControlTemplate>

        <Style x:Key="RadPaneStyle" TargetType="telerikDocking:RadDocumentPane">

            <Setter Property="Template" Value="{StaticResource RadPaneTemplate}"></Setter>

        </Style>

        private void BuildNewPane(int iPaneNum)

        {

//iPaneNum is the current pane count on the RadPaneGroup

            RadDocumentPane rp = new RadDocumentPane();

            //rp.Name = "rpDgrm" + (iPaneNum - 1);

            rp.CanUserPin = false;

            rp.CanUserClose = false;

            rp.CanFloat = false;

            rp.IsPinned = true;

            rp.Header = "Diagram" + (iPaneNum - 1);

            try

            {

                //rp.Template = (ControlTemplate)this.Resources["RadPaneTemplate"];

                rp.Style = (Style)this.Resources["RadPaneStyle"];

                rp.UpdateLayout();

                rpgDiagrams.Items.Add(rp);

                rpgDiagrams.UpdateLayout();

            }

            catch

            {

            }

}

[Miroslav Nedyalkov]

Hi Lindsay,

 I'm not sure I understand you correctly - do you want to customize the look of the content of the pane or the header of the pane? The pane itself is displayed as a tab item and by changing its control template you will not change the content. In the first post you are changing the content, not the header, so the two approaches you pointed are doing far different things.

Could you please explain in more details what you need to achieve and we will try to help you with this.

Your first post makes me think you are hitting an old issue we already fixes, so I would suggest you to try the latest version of Rad Controls for Silverlight.

Best wishes,
Miroslav Nedyalkov
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

[Lindsay Miles]

Miroslav, thanks for getting to this...

I want the user to add radpanes to the radpanegroup when the user selects "New Doc" off a menu as example. All these panes must have the same controls - an image, 3 combo boxes, labels and 3 text boxes. These are arranged in various stackpanels so that I can dynamically re-arrange their layout later (not part of the issue right now).

Please see the controltemplate markup on this in my 2nd post.

As each pane is added, these controls should be added to the new pane, not the Header.

I'm NOT trying to add to the Header, but the content of pane itself so the controls display on EACH pane.

I'm using version 2010.1.422.1040 of all Telerik components.

Thanks

[Miroslav Nedyalkov]

Hello Lindsay,

 What I could suggest you is to use the ContentTemplate or the Content properties of the RadPane control. ContentTemplate seems more suitable for your requirement.

Sincerely yours,
Miroslav Nedyalkov
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

[Lindsay Miles]

Miroslav, this is very frustrating!

Take a look at my first post on this thread. I AM assigning a grid to the RadPane.Content but the controls in the grid show up on the first RadPane, rp1 and not rp2 as specified in code! If I specify the size of the grid, THEN the controls in the grid show up. I guess the grid doesn't adjust itself according to it's own content...

Moving on: Build a more complex grid with nested stackpanels and controls in those stack panels.

Again, if I specify width/height on the stack panels MOST controls show, however, if stackpanels are nested more than two deep, controls in the 3rd tier stack panel show up on the first RadPane (rp1), NOT in the panel/pane it is specified in (rp2).

Your RadPane is not handling the more complex control markup and I've specified sizes on ALL controls now.

IS there a special order in which controls should be added to controls to controls to controls ... that I might not be aware of?

That is where I think the problem lies AND it does not seem to be the obvious - add controls from bottom to top of "tree".

Some code using Content or preferably using ContentTemplate for the RadPane would be most useful.

Thanks

[Lindsay Miles]

Miroslav, here is a different approach using a Grid Style instead of adding controls in code.

I've assigned the style to my grid then the grid to the RadPane.Content

What am I doing WRONG? My style is in error? Assigning grid to content is in error?

Any sample of ContentTemplate? And code use?

Thanks!

        <ControlTemplate x:Key="GridDgrmTemplate" TargetType="Grid">

            

            <!-- Grid Width="600" Height="600" Background="Cyan" -->

                <StackPanel Width="600" Height="600" Orientation="Vertical">

                    <Canvas Height="300" Width="600" MouseLeftButtonDown="canvas1_MouseLeftButtonDown" MouseLeftButtonUp="canvas1_MouseLeftButtonUp" MouseMove="canvas1_MouseMove" Margin="0,0,0,0">

                        <Image Margin="0,0,0,0" Source="/MyApp;component/Images/pngs/temp.png"></Image>

                    </Canvas>

                    <Canvas Height="300" Width="600">

                        <StackPanel Height="300" Width="600" Orientation="Vertical" >

                            <StackPanel Height="25" Width="597" Orientation="Horizontal" Margin="4,0,0,0" HorizontalAlignment="Left">

                                <StackPanel Orientation="Horizontal" Width="175" HorizontalAlignment="Left" VerticalAlignment="Stretch" Margin="0,3,0,0">

                                    <dataInput:Label Content="Dwg Type:" Height="25" Width="70"></dataInput:Label>

                                    <ComboBox Width="100"></ComboBox>

                                </StackPanel>

                                <StackPanel Orientation="Horizontal" Width="220" HorizontalAlignment="Left" VerticalAlignment="Stretch" Margin="0,3,0,0">

                                    <dataInput:Label Content="Dwg Focus:" Height="25" Width="70"></dataInput:Label>

                                    <ComboBox Width="138"></ComboBox>

                                </StackPanel>

                                <StackPanel Orientation="Horizontal" Width="200" HorizontalAlignment="Left" VerticalAlignment="Stretch" Margin="0,3,0,0">

                                    <dataInput:Label Content="Iteration:" Height="25" Width="115" ></dataInput:Label>

                                    <ComboBox Width="85"></ComboBox>

                                </StackPanel>

                            </StackPanel>

                            <StackPanel Height="25" Width="370" Orientation="Horizontal" Margin="4,3,0,0" HorizontalAlignment="Left">

                                <dataInput:Label Content="Dwg Title:" Height="25" Width="70" HorizontalAlignment="Left"></dataInput:Label>

                                <TextBox Width="295" HorizontalAlignment="Left"></TextBox>

                            </StackPanel>

                            <StackPanel Orientation="Horizontal" Width="600" Height="240">

                                <StackPanel Height="235" Width="297" Orientation="Vertical">

                                    <dataInput:Label Content="Dwg Notes:" Height="25" Margin="4,0,0,0"></dataInput:Label>

                                    <TextBox Height="200" Margin="4,0,0,0" AcceptsReturn="True" VerticalScrollBarVisibility="Auto"></TextBox>

                                </StackPanel>

                                <StackPanel Height="235" Width="297" Orientation="Vertical">

                                    <dataInput:Label Content="Dwg Description:" Height="25" Margin="4,0,0,0"></dataInput:Label>

                                    <TextBox Height="200" Margin="4,0,0,0" AcceptsReturn="True" VerticalScrollBarVisibility="Auto"></TextBox>

                                </StackPanel>

                            </StackPanel>

                        </StackPanel>

                    </Canvas>

                </StackPanel>

            <!-- /Grid -->

        </ControlTemplate>

        <Style x:Key="GridDgrmStyle" TargetType="Grid">

            <Setter Property="Style" Value="{StaticResource GridDgrmTemplate}"></Setter>

        </Style>

----------------------------------------------------------------------------------

        private void BuildNewPane(int iPaneNum)

        {

            RadPane rp = new RadPane();

            rp.Name = "rpDgrm" + (iPaneNum - 1);

            rp.CanUserPin = false;

            rp.CanUserClose = true;

            rp.CanFloat = false;

            rp.IsPinned = true;

            rp.Header = "Diagram" + (iPaneNum - 1);

            try

            {

                Grid g = new Grid();

                g.Width = 600;

                g.Height = 600;

                g.Style = (Style)this.Resources["GridDgrmStyle"];

                g.UpdateLayout();

                rp.Content = g;

                rp.UpdateLayout();

                rpgDiagrams.Items.Add(rp);

                rpgDiagrams.UpdateLayout();

                return;

            }

            catch

            {

            }

}

[Lindsay Miles]

Miroslav,

I have the code working. No Templates or Styles (although that would be ideal and great to know).

The sizes of the controls in the "structure" need to be specified, else the "parent" control does not display it. At least that is what I've found. 

Also, the BitmapImage object's CreateOptions property need to be set to None else the app does not render the image before being assigned to the Image.Source property and thus not before displaying the tabs either.

So, if you have time, a template, contenttemplate sample would be great BUT, I know you're busy and I have this working so all is good for now.

Thanks for your patience and help!

[Miroslav Nedyalkov]

Hello Lindsay,

 I'm happy that you were able to solve the problem.
Anyway I would really like to provide you with such a sample, but I cannot understand what you need to do. If you provide us with more information and with your current solution we could try to provide you another one.

All the best,
Miroslav Nedyalkov
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

[Lindsay Miles]

Miroslav, thanks for the help.

Actually, once I gave it all more thought and was no longer "caught up" in xaml and styles, I created a UserControl with all the constituent controls I need. Injected that into the RadPane.Content property each time a add a pane. All is good.

One issue I think I might have found is:

As I add and instance of myusercontrol to each new pane, I name the control with the pane index:

usrctl.name = "usrctl" + rpg.items.count; 

If I then try to do a FindName("usrctl1") on the current pane, the usrcrl is not returned OR if I FindChildByType, same issue.

My thought is adding the control to RadPane.content, does not make it a child of that RadPane.

To get to the usrcontrol in code, I cast back: MyUserControl usrctl = (MyUserControl)RadPane.Content;

Funny thing is, I was retrieving the control in the SelectionChanged event on the RadPaneGroup and it fired when a new RadPane was added. In THAT one firing of the event, the FindName method worked. Once all the panes are added and I navigate between panes, thus firing the SelectionChanged event each time, THEN the FindName method would not work and I did the casting trick instead.

All works! Albeit not very pretty :-)

Now I will think of Styling the UserControl but I have other work to do for now.

Thanks again.

[Miroslav Nedyalkov]

Hi Lindsay,

 I was able to reproduce the described behavior - it happens for generated panes only and only when the pane that contains the searched content is not the selected one. In my opinion this problem is caused, because the content of the pane that is not currently selected is not part of the visual tree. What I would suggest you is not to put names to the user controls but to the panes to find their contents.

Best wishes,
Miroslav Nedyalkov
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

[Lindsay Miles]

Actually, I marked the last post as answer but one needs to go through the whole post as there isn't ONE answer here but more a combination of "answers" to different related issues.

Hope this helps someone...

Thanks Miroslav!