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

Specific Large Content Size?

6 Answers 141 Views
TileView
This is a migrated thread and some comments may be shown as answers.
Michael
Top achievements
Rank 1
Michael asked on 06 Mar 2010, 03:30 AM
Hello,
I want to layout my TileView so that it lives inside an Grid Row that is set to 'Auto'.

I want the large content to always be the same size, not matter how much space I have in the row. (Say 300 width by 500 height) while the rest of the tile items will use a maximum of two rows but limitless columns.

I have figured out most of this, except how to force a specfic size for the large conent.

Thanks, really enjoying your controls.

Mel

6 Answers, 1 is accepted

Sort by
0
Tihomir Petkov
Telerik team
answered on 09 Mar 2010, 04:00 PM
Hi Michael,

You only need to set the desired size to the content you put in RadFluidContentControl's LargeContent property. In fact, the FluidContentControl does not care what you put in its content properties - it changes the currently visible content only on the basis of the space that is available to it and the thresholds. Alternatively, you can change the visible content manually if you set the RadFluidContentControl.ContentChangeMode property to "Manual" and take care of changing the state yourself. This being said, you only need to hard-code the size of the element you put in the LargeContent property of the FluidContentControl.

All the best,
Tihomir Petkov
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.
0
Michael
Top achievements
Rank 1
answered on 10 Mar 2010, 12:15 AM
Please look at my example in the picture...the green is the row where the tile view belongs. this row is set to 'Auto' in the grid.
The pink are the small content items, and the large block is the large block content. I am not clear on how to force the large content size to not expand beyond what is availble in the container it belongs too. I don't want it to be ANY bigger than 300x300.

Here is the code that I am using as a test.
        <t:RadExpander Grid.Row ="1"  x:Name="rexCust" IsExpanded="True"  Background="{StaticResource BorderBlack}">  
            <t:RadExpander.Header> 
                <StackPanel Background="{StaticResource BorderBlack}">  
                    <TextBlock Text="Customer Locations"  Style="{StaticResource ExpanderHeader}"></TextBlock> 
                </StackPanel> 
            </t:RadExpander.Header> 
            <t:RadExpander.Content> 
                <teknav:RadTileView Height="150">  
                    <teknav:RadTileViewItem> 
                        <t:RadFluidContentControl> 
                            <t:RadFluidContentControl.LargeContent> 
                                <Border BorderThickness="5" Height="300" Width="300"></Border> 
                            </t:RadFluidContentControl.LargeContent> 
                            <t:RadFluidContentControl.SmallContent> 
                                <Border BorderThickness="5" Height="100" Width="100"></Border> 
                            </t:RadFluidContentControl.SmallContent> 
                            <t:RadFluidContentControl.Content> 
                                <Border BorderThickness="5" Height="200" Width="200"></Border> 
                            </t:RadFluidContentControl.Content> 
                        </t:RadFluidContentControl> 
                    </teknav:RadTileViewItem> 
                    <teknav:RadTileViewItem> 
                        <t:RadFluidContentControl> 
                            <t:RadFluidContentControl.LargeContent> 
                                <Border BorderThickness="5" Height="300" Width="300"></Border> 
                            </t:RadFluidContentControl.LargeContent> 
                            <t:RadFluidContentControl.SmallContent> 
                                <Border BorderThickness="5" Height="100" Width="100"></Border> 
                            </t:RadFluidContentControl.SmallContent> 
                            <t:RadFluidContentControl.Content> 
                                <Border BorderThickness="5" Height="200" Width="200"></Border> 
                            </t:RadFluidContentControl.Content> 
                        </t:RadFluidContentControl> 
                    </teknav:RadTileViewItem> 
                    <teknav:RadTileViewItem> 
                        <t:RadFluidContentControl> 
                            <t:RadFluidContentControl.LargeContent> 
                                <Border BorderThickness="5" Height="300" Width="300"></Border> 
                            </t:RadFluidContentControl.LargeContent> 
                            <t:RadFluidContentControl.SmallContent> 
                                <Border BorderThickness="5" Height="100" Width="100"></Border> 
                            </t:RadFluidContentControl.SmallContent> 
                            <t:RadFluidContentControl.Content> 
                                <Border BorderThickness="5" Height="200" Width="200"></Border> 
                            </t:RadFluidContentControl.Content> 
                        </t:RadFluidContentControl> 
                    </teknav:RadTileViewItem> 
                </teknav:RadTileView> 
            </t:RadExpander.Content> 
        </t:RadExpander> 
Thanks for the help, hope I am not being painful.
0
Michael
Top achievements
Rank 1
answered on 10 Mar 2010, 03:44 PM
Ok maybe forget the post before this with the example code.I was under the impression that the 3 states of a tile view matched the 3 states of the content flow control.

All that I am trying to achieve is the in the .jpg I attached.

I have a grid layout, with one row. The row is set to auto, and takes the width of the screen no matter the resolution.
Inside that row I have a RadTileView. I want the the MAXIMIZED content of a RadTileViewItem to always be the same size no matter what size the row is but I want the RadTileView to take full advantage of the space in the row since there we don't know the amount of items that might be in the RadTileView. (It is going to read in x # of items from a database).

I also want the minimized/normal size and normal size to ALWAYS be the same no matter how much room I have in the row.

The height of the ROW will always be 200, never greater. So the RadTileView height will be set to 200.

I am attaching the jpg again.


0
Tihomir Petkov
Telerik team
answered on 10 Mar 2010, 04:33 PM
Hi Michael,

As far as I can see from the code you pasted below, the content in the FluidContentControl.LargeContent property is a Border element with hard-coded size. Correct me if I'm wrong, but I think this Border element will not grow in size, no matter what space is available to it.

On a side note, I see you are not setting thresholds to the FluidContentControl, which might cause unexpected behavior since the default thresholds may not work in your specific layout.

Best wishes,
Tihomir Petkov
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.
0
Michael
Top achievements
Rank 1
answered on 10 Mar 2010, 04:48 PM
Hi,
As I said, I thought that the fluid content control states were synonymous with the minimized/maximized/normal which I see they are not.

So really my post question was not correct in saying

Specific Large Content Size?

It should say

Specific Maximized Size?

As I have asked, I want to be able to set a SPECIFIC size to the maximized state of this tile view, not matter what size is available to the container the TileView is in.

Let me just take this code:
  <teknav:RadTileView Height="300">  
                        <teknav:RadTileViewItem TileStateChanged="RadTileViewItem_TileStateChanged">  
 
                        </teknav:RadTileViewItem> 
                        <teknav:RadTileViewItem> 
                        
                        </teknav:RadTileViewItem>           
                    </teknav:RadTileView> 
 
        private void RadTileViewItem_TileStateChanged(object sender, Telerik.Windows.RadRoutedEventArgs e)  
        {  
            RadTileViewItem ri = sender as RadTileViewItem;  
            if (ri.TileState == TileViewItemState.Maximized)  
            {  
                ri.Width = 50;  
                ri.Height = 50;  
            }  
        } 

It does not work.
0
Tihomir Petkov
Telerik team
answered on 11 Mar 2010, 08:52 AM
Hello Michael,

Thanks for the clarification. Now I see what you were actually asking. The RadFluidContentControl is an independent control that is in no way restricted to usage within a TileView. That's why you need to take care of configuring it to work correctly in your specific case.

As for the size of the maximized tile, currently the TileView does not allow you to explitly set a specific size to it. What you can do is set the size of the entire TileView and thus indirectly restrict the size of the maximized tile. You will need to consider the RadTileView.MinimizedColumnWidth or RadTileView.MinimizedRowHeight property (you can modify them) depending on where the minimized tiles are docked. Also, depending on the specific styles you use, Margins and Paddings may need to be considered. Overall it sholdn't be too difficult to come up with a suitable total size of the TileView.

Best wishes,
Tihomir Petkov
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.
Tags
TileView
Asked by
Michael
Top achievements
Rank 1
Answers by
Tihomir Petkov
Telerik team
Michael
Top achievements
Rank 1
Share this question
or