This is a migrated thread and some comments may be shown as answers.

Expand Tabs from Left side and resizing the rest

3 Answers 166 Views
TabControl
This is a migrated thread and some comments may be shown as answers.
daddo
Top achievements
Rank 1
daddo asked on 07 Apr 2016, 12:31 PM

Hi, 

how can I make tabs on the left side that are per default collapsed (see picture) and which should expand to the right side resizing the rest of the window (Grids, etc). I've made the tab on the left side setting TabStrip left but I can't do the rest. there is no collapse property on the tab? 

 

telerik:RadTabControl   Align="Right" BackgroundVisibility="Collapsed" TabStripPlacement="Left" Grid.RowSpan="4" Grid.Row="1" >
            <telerik:RadTabItem  Header="Something" >
                <telerik:RadTreeView Grid.Row="1" IsDragDropEnabled="True"   Grid.RowSpan="4" >
                    <telerik:RadTreeViewItem Header="Football" />
                    <telerik:RadTreeViewItem Header="Tennis" />
                    <telerik:RadTreeViewItem Header="Cycling" />
                    <telerik:RadTreeViewItem Header="Basketball" />
                </telerik:RadTreeView>
            </telerik:RadTabItem>
        </telerik:RadTabControl>

 

 

3 Answers, 1 is accepted

Sort by
0
Ivan
Telerik team
answered on 11 Apr 2016, 02:36 PM
Hello daddo,

With the information provided so far we are not sure we understand the result that you want to achieve. Is your intention to collapse and expand the tab items by clicking on a button?

If this is the case, that scenario is not supported out of the box by RadTabControl. However, you can do this by retemplating the control.

Regards,
Ivan
Telerik
Do you need help with upgrading your AJAX, WPF or WinForms project? Check the Telerik API Analyzer and share your thoughts.
0
daddo
Top achievements
Rank 1
answered on 12 Apr 2016, 09:31 AM
Hi Ivan, thank you, i read about retemplating a control but i don't understand how to retemplate it to make the tab collapsable. It should work this way: when I click on the Tab (which is collapsed by default) it should expand to the right making TreeView visible (which is TabItem)  and resize the rest of the objects in the window so they are all visible but smaller. I made the Tab collapsable in the code behind (on mouse_DoubleClick event- still don't know how to do it one one mouse click) but when the TreeView expands from the Tab it doesn't make other elements in the window move and resize ( I have all Rows and Columns set to Auto). It should work similar to the Tools tab in Visual Studio which is on the side and when you click it a window appears (except in my case it's a TreeView and the rest of the Window should move to the right and resize accordingly)
0
Ivan
Telerik team
answered on 13 Apr 2016, 08:03 AM
Hi daddo,

RadTabControl does not support out of the box the behaviors desired by you. In order to achieve your requirement you will need to write custom code.

Given your last clarifications, it seems that you can explore the option of using the RadDocking control instead of RadTabControl.

The default behavior of the docking control is to open the tabs on mouse enter. However, with little customization the opening of the tabs can happen on mouse click. This is demonstrated in the attached project with the CustomFlyoutBehavior class.

However this control also does not have built in functionality to resize the other elements when a tab is opened. The tabs are implemented as popups and for achieving the desired result you can manually resize the desired elements when a tab is opened.

Regards,
Ivan
Telerik
Do you need help with upgrading your AJAX, WPF or WinForms project? Check the Telerik API Analyzer and share your thoughts.
Tags
TabControl
Asked by
daddo
Top achievements
Rank 1
Answers by
Ivan
Telerik team
daddo
Top achievements
Rank 1
Share this question
or