This is a migrated thread and some comments may be shown as answers.
tileview target
4 Answers 23 Views
This is a migrated thread and some comments may be shown as answers.
Zuhair
Top achievements
Rank 1
Zuhair asked on 30 Jan 2013, 11:12 AM
hello guys,

I want to have 6 items and one target with different order

please check the attached picture.

meaning i want the area with the black border to be the target.
when i maximize the red item it will be in the black border area and the orange and yellow items minimized.

however, i want to keep the blue,brown and purple items to be to the right of the screen all the time.

when i maximize  the blue item, the full content should be in the black border and the blue,brow and purple items will remain the same

any ideas...


4 Answers, 1 is accepted

Sort by
0
Tina Stancheva
Telerik team
answered on 04 Feb 2013, 08:43 AM
Hello Zuhair,

You can use two RadTileView instances to implement the described scenario. The first RadTileView will have 4 tiles - one maximized and three minimized items. The maximized item can contain a second RadTileView definition which will consist of 3 tiles.

I attached a sample solution where all RadTileView controls are declaratively defined in xaml as I wanted to demonstrated the basic idea of the suggested approach. However, if your solution requires a databinding approach, you can use the same logic to implement it.

Also, I am not sure how you'd like to align the items in the inner RadTileView, but I used an approach with different items sizing. This approach is further described in this blog post.

Kind regards,
Tina Stancheva
the Telerik team

Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

0
Zuhair
Top achievements
Rank 1
answered on 13 Feb 2013, 10:16 AM
Hello Tina,

thank you for your help. it was a very helpful.

now I have three tiles and I want to be able when i maximize one of them the other two visibility will be hidden.
when i minimize or restore the maximized tile the other two tiles should be visible.

i tried the simple code below, but for some reasons it does not work.


here is the xaml:
<telerik:RadTileViewItem  Background="Lavender" TileState="Maximized" x:Name="main" TileStateChanged="main_TileStateChanged">
                
                <telerik:RadTileView ColumnsCount="2" ColumnWidth="Auto"
                        telerik:TileViewPanel.IsColumnsShrinkEnabled="True"
                        telerik:TileViewPanel.IsRowsShrinkEnabled="True"
                        telerik:TileViewPanel.IsSizeBoundToPosition="True"
                        IsItemsSizeInPercentages="True" MinimizedColumnWidth="135" >
                    <telerik:RadTileViewItem Header="Tile A" Background="LightBlue" RestoredWidth="50" x:Name="a1" TileState="Restored" TileStateChanged="a1_TileStateChanged"  />
                    <telerik:RadTileViewItem Header="Tile B" Background="Black" RestoredWidth="50" x:Name="b1" TileState="Restored" TileStateChanged="b1_TileStateChanged" />
                    <telerik:RadTileViewItem Header="Tile C" Background="Pink" RestoredWidth="100" x:Name="c1" TileState="Restored" TileStateChanged="c1_TileStateChanged" />
                </telerik:RadTileView>
                
                
            </telerik:RadTileViewItem>


and here is the c#:

  public void a1_TileStateChanged(object sender, Telerik.Windows.RadRoutedEventArgs e)
        {
 if(a1.TileState.ToString()=="Maximized"){

            
            c1.Visibility = System.Windows.Visibility.Hidden;
            b1.Visibility = System.Windows.Visibility.Hidden;
            
            }

            if (a1.TileState.ToString() == "Restored")
            {
                
                c1.Visibility = System.Windows.Visibility.Visible;
                b1.Visibility = System.Windows.Visibility.Visible;
            }
           
}
your help is very much appreciated

regards
zuhair
0
Pavel R. Pavlov
Telerik team
answered on 18 Feb 2013, 12:56 PM
Hi Zuhair,

Please accept my apology for the delayed response.

In your case, you use the auto resizing logic of the RadTileView control and the better approach is to change the Opacity and the MinimizedColumnWidth properties. Please take a look at the attached project and let me know if it works for you.

Regards,
Pavel R. Pavlov
the Telerik team

Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

0
Zuhair
Top achievements
Rank 1
answered on 18 Feb 2013, 02:47 PM
Thank you so much.

it's running perfectly now.

have a great day and thanks for your help

Asked by
Zuhair
Top achievements
Rank 1
Answers by
Tina Stancheva
Telerik team
Zuhair
Top achievements
Rank 1
Pavel R. Pavlov
Telerik team
Share this question
or