RadWindow as a flyout

9 posts, 0 answers
  1. GEB
    GEB avatar
    228 posts
    Member since:
    Dec 2008

    Posted 03 Jan 2009 Link to this post

    I want to use the RadWindow as a flyout.  It would only have the close button, and would not be moveable or resizeable by the user.  But, when it initially appears, I want to have it appear as a flyout.  And when it closes, I want it to fly back in.  Any easy way to do this using the RadWindow?
  2. Hristo Borisov
    Admin
    Hristo Borisov avatar
    298 posts

    Posted 05 Jan 2009 Link to this post

    Hi Gary,

    You can hide the minimize and pin buttons using the PinMode and ResizeMode properties like this, moreover using the Fixed value of the PinMode property prevents the user from moving the control around the page.

    <nav:RadWindow PinMode="Fixed" ResizeMode="NoResize" x:Name="window"/> 

    Even though, the window is not resizable by the client, you can still move the window by using the left and top properties of the control. It's much easier to define an animation in xaml to do that for you instead of creating you own code-behind logic for moving the control around. You can use the sample code below to move RadWindow around the screen by using storyboard.

      <Grid x:Name="LayoutRoot" Background="White">  
            <Grid.Resources> 
                <Storyboard x:Name="transform">  
                    <DoubleAnimation  
                Storyboard.TargetName="window"   
                Storyboard.TargetProperty="Left" 
                From="0" To="300" Duration="0:0:5"   
                AutoReverse="True" RepeatBehavior="Forever" /> 
                    <DoubleAnimation  
                Storyboard.TargetName="window"   
                Storyboard.TargetProperty="Top" 
                From="0" To="300" Duration="0:0:5"   
                AutoReverse="True" RepeatBehavior="Forever" /> 
                </Storyboard> 
            </Grid.Resources> 
            <Button Content="Click" Click="Button_Click" /> 
            <nav:RadWindow PinMode="Fixed" ResizeMode="NoResize" x:Name="window"/>  
        </Grid> 

    And the code-behind logic for this:

            public Page()  
            {  
                InitializeComponent();  
                Loaded += new RoutedEventHandler(Page_Loaded);  
            }  
     
            void Page_Loaded(object sender, RoutedEventArgs e)  
            {  
                window.Show();  
            }  
              
            private void Button_Click(object sender, RoutedEventArgs e)  
            {  
                transform.Begin();  
            } 

    I hope this will help you to achieve your goals. Feel free to contact us for any further assistance.

    Best wishes,
    Hristo Borisov
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  3. GEB
    GEB avatar
    228 posts
    Member since:
    Dec 2008

    Posted 05 Jan 2009 Link to this post

    Thank you for the quick response.

    I did try your sample code, and it works great.  However, when I try this in my application, it does not recognize the RadWindow's name in the "transform" animation.  I have obviously tried other names to make sure that it wasn't something specific to the name that was being used.  Now, one major difference in my application from your working example is that my RadWindow and the animations is in a seperate UserControl so that my code can be as componentized as possible.  I am able to access the RadWindow name from the code-behind in that the TestWindow.Show() works great. But, when TestWindow is the target in the animation, it fails.

    The error is being generrated at run-time by the debugger, and is not being caught by the compiler.  Any idea as to why this is happening?
  4. Hristo Borisov
    Admin
    Hristo Borisov avatar
    298 posts

    Posted 06 Jan 2009 Link to this post

    Hi again Gary,

    Would you send us a sample application or some code snippets in which we can reproduce your problem in order to have a better response?

    Greetings,
    Hristo Borisov
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  5. GEB
    GEB avatar
    228 posts
    Member since:
    Dec 2008

    Posted 06 Jan 2009 Link to this post

    Here is page.xaml:

    <

     

    UserControl x:Class="TestRadWindow.Page"

     

     

    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

     

     

    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

     

     

    xmlns:mycontrols="clr-namespace:TestRadWindow"

     

     

    Width="400" Height="300">

     

     

     

     

    <Grid x:Name="LayoutRoot" Background="White">

     

     

     

    <mycontrols:TestPage></mycontrols:TestPage>

     

     

     

    </Grid>

     

    </

     

    UserControl>

    Here is page.xaml.cs:

     

    using

     

    System;

     

     

     

    using

     

    System.Collections.Generic;

     

     

     

    using

     

    System.Linq;

     

     

     

    using

     

    System.Net;

     

     

     

    using

     

    System.Windows;

     

     

     

    using

     

    System.Windows.Controls;

     

     

     

    using

     

    System.Windows.Documents;

     

     

     

    using

     

    System.Windows.Input;

     

     

     

    using

     

    System.Windows.Media;

     

     

     

    using

     

    System.Windows.Media.Animation;

     

     

     

    using

     

    System.Windows.Shapes;

     

     

     

    namespace

     

    TestRadWindow

     

    {

     

    public partial class Page : UserControl

     

     

     

     

    {

     

    public Page()

     

    {

    InitializeComponent();

    }

    }

    }

    Here is TestPage.xaml (my User Control that is called from page.xaml):

     

    <

     

    UserControl x:Class="TestRadWindow.TestPage"

     

     

     

     

     

     

    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

     

     

    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

     

     

    xmlns:telerik="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Navigation">

     

     

     

     

     

     

     

     

    <Grid>

     

     

     

     

     

     

     

    <Grid.Resources>

     

     

     

     

     

     

     

    <Storyboard x:Name="transform">

     

     

     

     

     

     

     

    <DoubleAnimation

     

     

    Storyboard.TargetName="window"

     

     

    Storyboard.TargetProperty="Left"

     

     

    From="-800" To="0" Duration="0:0:.4"

     

     

    AutoReverse="False" />

     

     

     

     

     

     

     

    </Storyboard>

     

     

     

     

     

     

     

    </Grid.Resources>

     

     

     

     

     

     

     

    <Button Content="Click" Width="100" Height="30" Click="Button_Click" />

     

     

     

     

     

     

     

    <telerik:RadWindow PinMode="Fixed" Width="800" Height="300" ResizeMode="NoResize" x:Name="window"/>

     

     

     

     

     

     

     

    </Grid>

     

    </

     

    UserControl>

    Here is my TestPage.xaml.cs:

     

    using

     

    System;

     

     

     

    using

     

    System.Collections.Generic;

     

     

     

    using

     

    System.Linq;

     

     

     

    using

     

    System.Net;

     

     

     

    using

     

    System.Windows;

     

     

     

    using

     

    System.Windows.Controls;

     

     

     

    using

     

    System.Windows.Documents;

     

     

     

    using

     

    System.Windows.Input;

     

     

     

    using

     

    System.Windows.Media;

     

     

     

    using

     

    System.Windows.Media.Animation;

     

     

     

    using

     

    System.Windows.Shapes;

     

     

     

    namespace

     

    TestRadWindow

     

    {

     

    public partial class TestPage : UserControl

     

     

     

     

    {

     

    public TestPage()

     

    {

    InitializeComponent();

    }

     

    private void Button_Click(object sender, RoutedEventArgs e)

     

    {

    window.Show();

    transform.Begin();

    }

    }

    }

    I get a runtime error on transform.begin(), where the name "transform" cannot be found.  This does not occur when the code is combined, as in your example, without a seperate UserControl.  No compile errors or warnings are generated.

  6. GEB
    GEB avatar
    228 posts
    Member since:
    Dec 2008

    Posted 06 Jan 2009 Link to this post

    Here is the same code, formatted as a code block.

    Page.xaml:

    <UserControl x:Class="TestRadWindow.Page" 
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"   
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"   
        xmlns:mycontrols="clr-namespace:TestRadWindow" 
        Width="400" Height="300">  
          
        <Grid x:Name="LayoutRoot" Background="White">  
            <mycontrols:TestPage></mycontrols:TestPage> 
        </Grid> 
    </UserControl> 
     

    Page.xaml.cs:

    using System;  
    using System.Collections.Generic;  
    using System.Linq;  
    using System.Net;  
    using System.Windows;  
    using System.Windows.Controls;  
    using System.Windows.Documents;  
    using System.Windows.Input;  
    using System.Windows.Media;  
    using System.Windows.Media.Animation;  
    using System.Windows.Shapes;  
     
    namespace TestRadWindow  
    {  
        public partial class Page : UserControl  
        {  
            public Page()  
            {  
                InitializeComponent();  
            }  
     
        }  
    }  
     

    TestPage.xaml:

    <UserControl x:Class="TestRadWindow.TestPage" 
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"   
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"   
        xmlns:telerik="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Navigation">  
          
        <Grid> 
            <Grid.Resources> 
                <Storyboard x:Name="transform">  
                    <DoubleAnimation     
                Storyboard.TargetName="window"      
                Storyboard.TargetProperty="Left"    
                From="-800" To="0" Duration="0:0:.4"      
                AutoReverse="False" /> 
                </Storyboard> 
            </Grid.Resources> 
            <Button Content="Click" Width="100" Height="30" Click="Button_Click" /> 
            <telerik:RadWindow PinMode="Fixed" Width="800" Height="300" ResizeMode="NoResize" x:Name="window"/>  
        </Grid> 
    </UserControl> 
     

    TestPage.xaml.cs:

    using System;  
    using System.Collections.Generic;  
    using System.Linq;  
    using System.Net;  
    using System.Windows;  
    using System.Windows.Controls;  
    using System.Windows.Documents;  
    using System.Windows.Input;  
    using System.Windows.Media;  
    using System.Windows.Media.Animation;  
    using System.Windows.Shapes;  
     
    namespace TestRadWindow  
    {  
        public partial class TestPage : UserControl  
        {  
            public TestPage()  
            {  
                InitializeComponent();  
            }  
     
            private void Button_Click(object sender, RoutedEventArgs e)  
            {  
                window.Show();  
                transform.Begin();  
            }    
     
        }  
    }  
     
  7. Hristo Borisov
    Admin
    Hristo Borisov avatar
    298 posts

    Posted 07 Jan 2009 Link to this post

    Hello Gary,

    We also experience the same behavior, unfortunately there is some issue with the storyboard and our control we cannot resolve immediately. The only workaround, I can think of right now, is to define your storyboard in code-behind in which you have a reference to RadWindow and bind the animation explicitly like this:

                DoubleAnimation animLeft = new DoubleAnimation()   
                {   
                    Duration = new Duration(TimeSpan.FromSeconds(0.8)),  
                    From = 0,  
                    To = 400,   
                };  
     
                DoubleAnimation animTop = new DoubleAnimation()  
                {  
                    Duration = new Duration(TimeSpan.FromSeconds(0.8)),  
                    From = 0,  
                    To = 400,  
                };  
     
                Storyboard storyBoard = new Storyboard();  
                storyBoard.Children.Add(animLeft);  
                storyBoard.Children.Add(animTop);  
     
                Storyboard.SetTarget(animLeft, window);  
                Storyboard.SetTarget(animTop, window);  
                Storyboard.SetTargetProperty(animLeft, new PropertyPath("Left"));  
                Storyboard.SetTargetProperty(animTop, new PropertyPath("Top"));  
     
                storyBoard.Begin(); 


    Best wishes,
    Hristo Borisov
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  8. GEB
    GEB avatar
    228 posts
    Member since:
    Dec 2008

    Posted 27 Jan 2009 Link to this post

    Has anyone had a chance to take a look at this issue yet?
  9. Hristo Borisov
    Admin
    Hristo Borisov avatar
    298 posts

    Posted 27 Jan 2009 Link to this post

    Hi Gary,

    It is in our priority list for our next release, but unfortunately there are some other features and issues that are to be sorted out. Thank you for your patience and look forward from receiving more feedback about our controls.

    Sincerely yours,
    Hristo Borisov
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
Back to Top