problem in arranging tileview item , all tile items are aligning to top left corner.

4 posts, 0 answers
  1. raj
    raj avatar
    31 posts
    Member since:
    Jul 2011

    Posted 14 Feb 2012 Link to this post

    Hi all,
    I am using RadTileview control , and in this i have sued tileviewitem control , inside expression blend it is displaying properly but when i run they application all  tileview items will aligned to top left corner of the page , here i am pasting my code please have a look  on it: please let me know where i am doing the mistake.

            <telerik:RadTileView Grid.Row="1"  >
                <telerik:RadTileViewItem Header="Item1">
                    <TextBlock Text="Item1 Content"/>
                </telerik:RadTileViewItem>
                <telerik:RadTileViewItem Header="Item2">
                    <TextBlock Text="Item2 Content"/>
                </telerik:RadTileViewItem>
                <telerik:RadTileViewItem Header="Item3" >
                    <TextBlock Text="Item3 Content"/>
                </telerik:RadTileViewItem>
            </telerik:RadTileView>

    Please see the attachment , so that you can better understand.
  2. Kiril Stanoev
    Admin
    Kiril Stanoev avatar
    1512 posts

    Posted 14 Feb 2012 Link to this post

    Hello Raj,

     Please make sure that RadTileView is in a panel which does not measures its children with infinity (ex: StackPanel, Canvas, Grid.Row). I see that you set Grid.Row="1". What is the RowHeight of that particular row? It has to be * for RadTileView to render properly. If you're still unable to solver your issue, could you please send us a sample project reproducing the issue. This way we will be better able to assist you. Thank you for your cooperation.

    Kind regards,
    Kiril Stanoev
    the Telerik team
    Sharpen your .NET Ninja skills! Attend Q1 webinar week and get a chance to win a license! Book your seat now >>
  3. DevCraft banner
  4. raj
    raj avatar
    31 posts
    Member since:
    Jul 2011

    Posted 15 Feb 2012 Link to this post

    Hi Kiril Stanoev ,
    Thanks for reply,

    I have take a grid and inside which is having two rows, at row "0" im using a grid which have some buttons and in row 1 which is auto in height, i am using the RadTileview control but i dont understand where i am doing the mistake, but i have tested the same control in a sample application but there it's working properly. i cannot give you the project , but i am pasting my xaml code here please look in it

     I am using dockpanels in my Mainpage.xaml where this tileview page will display at runtime. will this effects ??

     <Grid x:Name="LayoutRoot" DataContext="{Binding Source={StaticResource bookSampleDataSource}}">
           
               <Grid.RowDefinitions>
                <RowDefinition Height="36" />
                <RowDefinition Height="37" />
                <RowDefinition />
                <RowDefinition Height="22" />

            </Grid.RowDefinitions>
            <Grid Background="{StaticResource InnerPagesMenuBackgroundBrush}"
                  Height="36">
                <StackPanel HorizontalAlignment="Left"
                            Orientation="Horizontal"
                            VerticalAlignment="Center"
                            Margin="11,0,0,0">
                    <Button Style="{StaticResource MenuButtonStyle}"
                            VerticalAlignment="Center"
                            d:LayoutOverrides="Width"
                            Margin="0,0,4,0">
                        <StackPanel Orientation="Horizontal">
                            <Image Height="16"
                                   Source="../Images/Icons/new-user.png"
                                   Stretch="Fill"
                                   Width="16" />
                            <TextBlock TextWrapping="Wrap"
                                       Text="New"
                                       Margin="7,0,0,0" />
                        </StackPanel>
                    </Button>
                    <Rectangle Fill="{StaticResource MenuItemDividerBrush}"
                               Height="14"
                               StrokeThickness="0"
                               Width="1"
                               Margin="2,0,3,0" />
                    <Button Style="{StaticResource MenuButtonStyle}"
                            VerticalAlignment="Center"
                            d:LayoutOverrides="Width"
                            Margin="0,0,4,0" Click="Button_Click">
                        <StackPanel Orientation="Horizontal">
                            <Image Height="16"
                                   Source="../Images/Icons/edit-user.png"
                                   Stretch="Fill"
                                   Width="16"
                                   HorizontalAlignment="Center"
                                   VerticalAlignment="Center" />
                            <TextBlock TextWrapping="Wrap"
                                       Text="Edit"
                                       Margin="7,0,0,0" />
                        </StackPanel>
                    </Button>
                    <Rectangle Fill="{StaticResource MenuItemDividerBrush}"
                               Height="14"
                               StrokeThickness="0"
                               Width="1"
                               Margin="2,0,3,0" />
                    <Button Style="{StaticResource MenuButtonStyle}"
                            VerticalAlignment="Center"
                            d:LayoutOverrides="Width" Click="Button_Click_1"
                            Margin="0,0,4,0">
                        <StackPanel Orientation="Horizontal">
                            <Image Height="16"
                                   Source="../Images/Icons/delete-user.png"
                                   Stretch="Fill"
                                   Width="16"
                                   HorizontalAlignment="Center"
                                   VerticalAlignment="Center" />
                            <TextBlock TextWrapping="Wrap"
                                       Text="Delete"
                                       Margin="7,0,0,0" />
                        </StackPanel>
                    </Button>
                    <Rectangle Fill="{StaticResource MenuItemDividerBrush}"
                               Height="14"
                               StrokeThickness="0"
                               Width="1"
                               Margin="2,0,3,0" />
                    <Button Style="{StaticResource MenuButtonStyle}"
                            VerticalAlignment="Center"
                            d:LayoutOverrides="Width"
                            Margin="0,0,4,0">
                        <StackPanel Orientation="Horizontal">
                            <Image Height="16"
                                   Source="../Images/Icons/refresh.png"
                                   Stretch="Fill"
                                   Width="16"
                                   VerticalAlignment="Center"
                                   HorizontalAlignment="Center" />
                            <TextBlock TextWrapping="Wrap"
                                       Text="Refresh"
                                       Margin="7,0,0,0" />
                        </StackPanel>
                    </Button>
                </StackPanel>
            </Grid>
            <Grid Grid.Row="1">

                <StackPanel Grid.ColumnSpan="5"
                            Grid.Column="1"
                            Orientation="Horizontal"
                            d:LayoutOverrides="Width"
                            Margin="14,0,0,0">
                    <TextBlock TextWrapping="Wrap"
                               Text="Filter"
                               VerticalAlignment="Center"
                               Margin="0,0,6,0" />
                    <ComboBox Height="24"
                              Width="153"
                              d:LayoutOverrides="Width"
                              Margin="0,0,15,0" />
                    <TextBlock TextWrapping="Wrap"
                               Text="Search By User"
                               VerticalAlignment="Center"
                               HorizontalAlignment="Left"
                               Padding="0,0,6,0" />
                    <TextBox TextWrapping="Wrap"
                             Height="24"
                             Width="159"
                             VerticalAlignment="Center"
                             HorizontalAlignment="Left" MouseLeftButtonDown="TextBox_MouseLeftButtonDown" />
                </StackPanel>
                <Rectangle Stroke="Black"
                           StrokeThickness="0"
                           Fill="#FFBCBCBC"
                           Height="0.5"
                           VerticalAlignment="Bottom" />
            </Grid>
            <sdk:DataGrid x:Name="dgUser"
                ItemsSource="{Binding bookCollection}"
                SelectedItem="{Binding SelectedUser, Mode=TwoWay}"
                RowHeaderStyle="{StaticResource DataGridRowHeaderStyle1}"
                CellStyle="{StaticResource DataGridCellStyle1}"
                RowStyle="{StaticResource DataGridRowStyle2}"
                AutoGenerateColumns="False"
                RowHeight="25"
                         
                BorderThickness="0"
                Background="{x:Null}" Grid.Row="2" Visibility="Collapsed">
                <sdk:DataGrid.Columns>
                    
                    <sdk:DataGridTemplateColumn >
                        
                        <sdk:DataGridTemplateColumn.CellTemplate>
                            <DataTemplate>
                                <Image Source="../Images/User.png" Margin="4"/>
                            </DataTemplate>
                        </sdk:DataGridTemplateColumn.CellTemplate>
                    </sdk:DataGridTemplateColumn>            
                    
                    <sdk:DataGridTextColumn  Binding="{Binding id}"
                        Header="iD"
                        MinWidth="50" />
                    <sdk:DataGridTextColumn Binding="{Binding price}"
                        Header="price"
                        MinWidth="100" />
                    <sdk:DataGridTextColumn Binding="{Binding publish_date}"
                        Header="publish_date"
                        MinWidth="100" />
                    <sdk:DataGridTextColumn Binding="{Binding author}"
                        Header="author"
                        MinWidth="100" />
                    <sdk:DataGridTextColumn Binding="{Binding description}" Header="description"/>            
                    
                </sdk:DataGrid.Columns>
                <i:Interaction.Triggers>
                    <i:EventTrigger EventName="Loaded">
                        <i:InvokeCommandAction Command="{Binding LoadUserCommand}"
                            CommandParameter="{Binding ElementName=dgUser}" />
                    </i:EventTrigger>
                </i:Interaction.Triggers>

            </sdk:DataGrid>
            <toolkit:BusyIndicator IsBusy="True" Grid.Row="2" VerticalAlignment="Top" Style="{StaticResource BusyIndicatorStyle1}" Visibility="Collapsed"/>
            <sdk:DataGrid Margin="0,8,8,185" Grid.Row="2" AutoGenerateColumns="False" ItemsSource="{Binding bookCollection}" Visibility="Collapsed">
                <sdk:DataGrid.Columns>
                    <sdk:DataGridTextColumn Binding="{Binding description}" Header="description"/>
                    <sdk:DataGridTextColumn Binding="{Binding genre}" Header="genre"/>
                    <sdk:DataGridTextColumn Binding="{Binding publish_date}" Header="publish_date"/>
                </sdk:DataGrid.Columns>
            </sdk:DataGrid>
            <telerik:RadTileView Margin="0,0,1,1" d:LayoutOverrides="Width, Height" Grid.Row="2">
                <telerik:RadTileViewItem Header="RadTileViewItem" Style="{x:Null}"/>
                <telerik:RadTileViewItem Header="RadTileViewItem"
                                         Style="{x:Null}" />
                <telerik:RadTileViewItem Header="RadTileViewItem"
                                         Style="{x:Null}" />
                <telerik:RadTileViewItem Header="RadTileViewItem"
                                         Style="{x:Null}" />
            </telerik:RadTileView>
        </Grid>


  5. Kiril Stanoev
    Admin
    Kiril Stanoev avatar
    1512 posts

    Posted 17 Feb 2012 Link to this post

    Hi Raj,

    I was not able to reproduce the issue you describe. I've removed the missing stuff from the code you gave us and did not see anything wrong with it. Could you please take a look at the attached project and let me know if I am missing anything. I'd be glad to further assist you. 

    Regards,
    Kiril Stanoev
    the Telerik team
    Sharpen your .NET Ninja skills! Attend Q1 webinar week and get a chance to win a license! Book your seat now >>
Back to Top