Accessing Controls in RadFluidContentControl

8 posts, 0 answers
  1. Helen
    Helen avatar
    101 posts
    Member since:
    Nov 2008

    Posted 28 Mar 2011 Link to this post

    This must be easy but -- how do I access the controls in a tileviewitem when it is maximized, before it is displayed? I want to touch up image borders, etc.

    Thanks

    Helen
  2. Petar Mladenov
    Admin
    Petar Mladenov avatar
    2891 posts

    Posted 31 Mar 2011 Link to this post

    Hello Helen,

    You can try to use the ChildrenOfType<> telerik extension method or you can specify x:Name of the FluidControl and access it directly. Please let us know if this helps you.

    Kind regards,
    Petar Mladenov
    the Telerik team
  3. DevCraft banner
  4. Helen
    Helen avatar
    101 posts
    Member since:
    Nov 2008

    Posted 31 Mar 2011 Link to this post

    I tried both your suggestions without success. However, I found a solution that works for me.

    On my Large content template, I have a border for an image. I wanted to remove that border if the image is null.

    What I did was add a Loaded Event handler to Border control in the Large Content template, and handled it thus:
     
    private void MyImageBorder_Loaded(object sender, RoutedEventArgs e)
    {
        Border b = sender as Border;
        if (b == null) return;
          b.Visibility = Visibility.Visible;
        Image img = b.Child as Image;
        if ((img == null) || (((BitmapImage)img.Source).PixelWidth == 0))
        {
            b.Visibility = Visibility.Collapsed;
            return;
        }
    }

     

     

     

     

     

     

     

     


  5. Petar Mladenov
    Admin
    Petar Mladenov avatar
    2891 posts

    Posted 05 Apr 2011 Link to this post

    Hi Helen,

    You could elaborate more on your scenario and provide the part of your xaml code you wish to use in code behind. This way we could advice you better and provide you with a better suited solution.

    Best wishes,
    Petar Mladenov
    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
  6. Helen
    Helen avatar
    101 posts
    Member since:
    Nov 2008

    Posted 05 Apr 2011 Link to this post

    Here's my Xaml:

    <
    DataTemplate x:Key="TVContentTemplate">
        <telerik:RadFluidContentControl ContentChangeMode="Manual" State="Normal" >
            <!-- Small Content -->
            <telerik:RadFluidContentControl.SmallContent>
                <Grid >
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto" />
                        <RowDefinition Height="Auto" />
                    </Grid.RowDefinitions>
                    <TextBlock TextWrapping="Wrap" Margin="5,5,5,0"
                        <Run Text="Department: " FontWeight="Bold"></Run>
                        <LineBreak/>
                        <Run Text="{Binding Path=Department.DepartmentName}" />
                    </TextBlock>
                    <TextBlock TextWrapping="Wrap" Margin="5" Grid.Row="1">
                        <Run Text="Name: " FontWeight="Bold" />
                        <LineBreak/>
                        <Run Text="{Binding FirstName}" />
                        <!--<Run Text=" " />-->
                        <Run Text="{Binding LastName}" />
                    </TextBlock>
                </Grid>
            </telerik:RadFluidContentControl.SmallContent>
            <!-- Normal Content -->
            <telerik:RadFluidContentControl.Content>
                <Grid>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto" />
                        <RowDefinition Height="Auto" />
                    </Grid.RowDefinitions>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="Auto" />
                        <ColumnDefinition Width="*" />
                    </Grid.ColumnDefinitions>
                    <Image Source="{Binding imageData, Converter={StaticResource ImageConverter}}"
                           VerticalAlignment="Center"
                           Grid.Row="0"
                           Grid.Column="0"
                           Grid.RowSpan="2"
                           Margin="5,5,5,10"
                           Width="75"
                           HorizontalAlignment="Left" />
                    <TextBlock TextWrapping="Wrap" Grid.Column="1" Grid.Row="0" Margin="5"
                        <Run Text="Department: " FontWeight="Bold"></Run>
                        <LineBreak/>
                        <Run Text="{Binding Path=Department.DepartmentName}" />
                    </TextBlock>
                    <TextBlock TextWrapping="Wrap" Margin="5" Grid.Column="1" Grid.Row="2">
                        <Run Text="Name: " FontWeight="Bold" />
                        <LineBreak/>
                        <Run Text="{Binding FirstName}" />
                        <!--<Run Text=" " />-->
                        <Run Text="{Binding LastName}" />
                    </TextBlock>
                </Grid>
            </telerik:RadFluidContentControl.Content>
            <!-- Large Content -->
            <telerik:RadFluidContentControl.LargeContent >
                <Border BorderBrush="Black" BorderThickness="2" Width="300" Height="500" CornerRadius="5" >
                    <Grid Background="{StaticResource BGBrush}" >
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto" />
                            <RowDefinition Height="Auto" />
                            <RowDefinition Height="Auto"   />
                            <RowDefinition Height="Auto" />
                            <RowDefinition Height="Auto" />
                            <RowDefinition Height="Auto" MinHeight="45" />
                        </Grid.RowDefinitions>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition />
                            <ColumnDefinition />
                        </Grid.ColumnDefinitions>
                        <TextBlock TextWrapping="Wrap" Margin="5,10,5,5"  Grid.Row="0" Grid.ColumnSpan="2" HorizontalAlignment="Center">
                            <Run Text="Name: " FontWeight="Bold" FontSize="16" />
                            <Run Text="{Binding FirstName}"  FontSize="16" />
                            <!--<Run Text=" " />-->
                            <Run Text="{Binding LastName}"  FontSize="16" />
                        </TextBlock>
                        <TextBlock TextWrapping="Wrap" Grid.Row="1" Grid.ColumnSpan="2" Margin="5" HorizontalAlignment="Center"
                            <Run Text="Department: " FontWeight="Bold"  FontSize="16" />
                            <Run Text="{Binding Path=Department.DepartmentName}"  FontSize="16"  />
                        </TextBlock>
                        <Border x:Name="MyImageBorder" Grid.Row="2" Grid.ColumnSpan="2" Margin="5" HorizontalAlignment="Center"
                            MaxHeight="200" Style="{StaticResource ImageBorder}" MaxWidth="200" Loaded="MyImageBorder_Loaded" >
                            <Image x:Name="imgPerson" Margin="10" Stretch="Uniform" Source="{Binding imageData, Converter={StaticResource ImageConverter}}"  />
                        </Border>
                        <TextBlock TextWrapping="Wrap" Grid.Row="3" Grid.ColumnSpan="2" Margin="5" HorizontalAlignment="Center"
                            <Run Text="Extension: " FontWeight="Bold"  FontSize="16" />
                            <Run Text="{Binding Path=Extension}"  FontSize="16"  />
                        </TextBlock>
                        <Border Grid.Row="4" Grid.ColumnSpan="2" Margin="5" BorderBrush="Aqua" BorderThickness="1" CornerRadius="3" >
                            <Grid x:Name="grdDial"  >
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="*" />
                                    <ColumnDefinition Width="100" />
                                </Grid.ColumnDefinitions>
                                <TextBlock x:Name="txtInstruction" Grid.Row="4"  Margin="5"  FontSize="16"
                                    Text="To call, pick up the phone and press the 'Dial' button" TextWrapping="Wrap"/>
                                <Button x:Name="btnDial" Grid.Column="1" HorizontalAlignment="Center" VerticalAlignment="Center" Height="30" Style="{StaticResource GlassButton}" 
                                    FontSize="16" Margin="5" Padding="10,5,10,5"
                                    Content="  Dial  " Click="btnDial_Click" />
                            </Grid>
                        </Border>
                        <Button x:Name="btnCancel" Grid.Row="5" Grid.ColumnSpan="2"  HorizontalAlignment="Center" Style="{StaticResource GlassButton}" 
                            FontSize="16" Margin="5" 
                            Content="  Close  " Click="btnClose_Click" />
                    </Grid>
                </Border>
            </telerik:RadFluidContentControl.LargeContent>
        </telerik:RadFluidContentControl>
    </DataTemplate>
  7. Helen
    Helen avatar
    101 posts
    Member since:
    Nov 2008

    Posted 05 Apr 2011 Link to this post

    Further to my last post, I've included the code behind for the tileStateChanged event.

    The ChildrenOfType<Border>() would populate a list of borders, but the Name property was always empty. Is this a bug?

    private void tileView_TileStateChanged(object sender, Telerik.Windows.RadRoutedEventArgs e)
     {
         RadTileViewItem item = e.Source as RadTileViewItem;
         if (item != null)
         {
             RadFluidContentControl fluidControl = item.ChildrenOfType<RadFluidContentControl>().First();
             if (fluidControl != null)
             {
                 switch (item.TileState)
                 {
                     case TileViewItemState.Maximized:
                         fluidControl.State = FluidContentControlState.Large;
                         //MessageBox.Show("Maximized");
                         IList<Border> borders = item.ChildrenOfType<Border>();
                         IList<Border> borders2 = fluidControl.ChildrenOfType<Border>();
                         IList<Image> img = item.ChildrenOfType<Image>();
                         break;
                     case TileViewItemState.Minimized:
                         fluidControl.State = FluidContentControlState.Small;
                         break;
                     case TileViewItemState.Restored:
                         fluidControl.State = FluidContentControlState.Normal;
                         break;
                 }
             }
         }
     }
  8. Zarko
    Admin
    Zarko avatar
    755 posts

    Posted 07 Apr 2011 Link to this post

    Hello Helen,

     The problems comes from the TransitionControl because it delays the actual change of the content and when you handle the TileStateChanged event the maximized item is still with the restored content. You can work around this issue by manually finding the correct content(the Large Content in your case) like this:

    private void myTileView_TileStateChanged(object sender, Telerik.Windows.RadRoutedEventArgs e)
    {
        var container = e.OriginalSource as RadTileViewItem;
        if (container != null)
        {
            if (container.TileState == TileViewItemState.Maximized)
            {
                if (container.ChildrenOfType<RadFluidContentControl>().Count > 0)
                {
                    var fluidControl = container.ChildrenOfType<RadFluidContentControl>()[0];
                    var myBorder = (fluidControl.LargeContent as Border).ChildrenOfType<Border>().Where(b => b.Name == "MyImageBorder").FirstOrDefault();
                    myBorder.BorderThickness = new Thickness(5);
                }
            }
        }
    }
    If you have further questions feel free to ask.

    Best wishes,
    Zarko
    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
  9. Helen
    Helen avatar
    101 posts
    Member since:
    Nov 2008

    Posted 08 Apr 2011 Link to this post

    Gee, why didn't I think of that? lol

    Thanks guys -- I'll give it a whilr.

    Cheers
Back to Top
DevCraft banner