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

PanelBar Design Question

2 Answers 46 Views
PanelBar
This is a migrated thread and some comments may be shown as answers.
Ali Rafiee
Top achievements
Rank 1
Ali Rafiee asked on 20 Jul 2011, 09:29 PM
Hi all,

.Net newbie here.

I'm trying to design a page that has a bunch of options on a screen, where some are optional, and a button on the bottom of the page that the user must press to procceed.

I've put together a user control for each set of options, which are then inserted as the different panels of the PanelBar on the main page.
This works out pretty good since the options are hidden unless the user want's to mess with them.

The PanelBar has the HorizontalAlignment="Stretch" so it is taking up the entire width of the page.

I have two problems.
1. I can figure out how to add a button at the bottom of the page, while the scrollbar for the PanelBar takes up the entire rightside to the bottom of the screen.
2. The top two Panels are not optional so the user must select something. Is there anyway I can lock the top two panels open so that the user can't collapse them?

2 is not a big deal but would be nice if I had the option to lock the panels open.

But 1 is a must.  What I want to accomplish for the button to be at the bottom of the page where if all the panels are expanded and a scrollbar is visible the user would have to scroll to see the button.
What I tried to do was add an extra PanelBarItem as the last item in the panel bar, and remove its Header so that the user can't collapse it, but can't figure out away to remove it.

Worst case I can have the button just below the PanelBar, but that would make the scrollbar come up short (the height of the button) toward the bottom of the page, which is going to look a little funny.

2 Answers, 1 is accepted

Sort by
0
Ali Rafiee
Top achievements
Rank 1
answered on 20 Jul 2011, 10:18 PM
I figured out how to keep the PanelBarItem from collapsing.

I'm catching the Collapsed event and expanding the item back.

Does anyone know how to get rid of the ^ icon on the right side of the item's header. That way the user won't even know it is clickable.

Thanks.
0
Petar Mladenov
Telerik team
answered on 26 Jul 2011, 09:12 AM
Hello Ali Rafiee,

 You have to edit the default style of RadPanelBarItem and remove the Data from the Path named "arrow":

<Path x:Name="arrow" Grid.Column="5" Data="M 1,1.5 L 4.5,5 L 8,1.5" HorizontalAlignment="Right" Margin="7 0" Opacity="1" RenderTransformOrigin="0.5 0.5" Stretch="None" Stroke="{StaticResource ControlElement_Normal}" StrokeThickness="2" VerticalAlignment="Center">
                        <Path.RenderTransform>
                            <RotateTransform x:Name="directionRotation" Angle="0"/>
                        </Path.RenderTransform>
                    </Path>
You can find this realized in the attached project. The edited style is applied to all RadPanelBarItems in XAML. Let us know if you need further assistance.
Regards,
Petar Mladenov
the Telerik team

Register for the Q2 2011 What's New Webinar Week. Mark your calendar for the week starting July 18th and book your seat for a walk through of all the exciting stuff we will ship with the new release!

Tags
PanelBar
Asked by
Ali Rafiee
Top achievements
Rank 1
Answers by
Ali Rafiee
Top achievements
Rank 1
Petar Mladenov
Telerik team
Share this question
or