Problem in RadLiveTileElement animation

4 posts, 0 answers
  1. Hasan
    Hasan avatar
    2 posts
    Member since:
    May 2017

    Posted 16 May 2017 Link to this post

    I am using a RadLiveTileElement. I want to put two custom user control and one LightVisualElement in it. I have written the following lines of code:

     

    this.lteFrames1.ContentChangeInterval = 4000;
    this.lteFrames1.TransitionType = ContentTransitionType.SlideUp;
    this.lteFrames1.Text = "";
    this.lteFrames1.TextImageRelation = TextImageRelation.Overlay;
    this.lteFrames1.ForeColor = Color.Black;
    this.lteFrames1.Row = 0;
    this.lteFrames1.Column = 0;

    RadHostItem host = new RadHostItem(new ucChartSalePerCompany()
    {
    Dock = DockStyle.Fill
    });           
    this.lteFrames1.Items.Add(host);

    RadHostItem host2 = new RadHostItem(new ucChartSalePerMonth()
    {
    Dock = DockStyle.Fill
    });

    this.lteFrames1.Items.Add(host2);
    this.lteFrames1.Items.Add(new LightVisualElement()
    {
    Padding = new Padding(4, 30, 0, 0),
           Font = new Font("Segoe UI Light", 12, GraphicsUnit.Point),
           ShouldHandleMouseInput = false,
           NotifyParentOnMouseInput = true,
           BackgroundImage = Properties.Resources.saleList2,
           BackgroundImageLayout = ImageLayout.Stretch,
           ForeColor = Color.Green,
           ZIndex = 10000
    });

     

    Everything is ok except the animation. The animation transition is ok only for the last item (LightVisualElement) that comes up inside of RadLiveTileElement and the other items (my user controls) come up from outside of RadLiveTileElement.

    How can I solve this problem?

    Thanks,

  2. Dess | Tech Support Engineer, Sr.
    Admin
    Dess | Tech Support Engineer, Sr.  avatar
    3320 posts

    Posted 17 May 2017 Link to this post

    Hello Hasan, 

    Thank you for writing.  
     
    According to the provided information, it seems that you host controls in RadLiveTileElement. Using controls in RadElements may slow down the scrolling and will cause visual glitches as they do not support clipping. I think this the case here. A better option would be using elements instead of controls. Thus, you can construct the desired look. The following help article demonstrates a sample approach: http://docs.telerik.com/devtools/winforms/panorama/custom-tiles  

    I hope this information helps. Should you have further questions I would be glad to help.

    Regards,
    Dess
    Telerik by Progress
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  3. Hasan
    Hasan avatar
    2 posts
    Member since:
    May 2017

    Posted 20 May 2017 in reply to Dess | Tech Support Engineer, Sr. Link to this post

    I have one problem. I can not add RadChartView to Children. When I use this:

     

    this.Children.Add(radChartView1);

     

    I get the following error:

    cannot convert from 'Telerik.WinControls.UI.RadChartView' to 'Telerik.WinControls.RadElement'

     

    what should I do?

     

  4. Dess | Tech Support Engineer, Sr.
    Admin
    Dess | Tech Support Engineer, Sr.  avatar
    3320 posts

    Posted 22 May 2017 Link to this post

    Hello Hasan, 

    Thank you for writing back. 

    As it was explained in the previous reply, a better option would be using elements instead of controls. Here is a sample code snippet how to add a RadChartElement with two BarSeries:
    public RadForm1()
    {
        InitializeComponent();
        RadLiveTileElement radLiveTileElement1 = new RadLiveTileElement();
        this.radPanorama1.RowsCount = 2;
        radLiveTileElement1.RowSpan = 2;
        radLiveTileElement1.ColSpan = 4;
        RadChartElement chart = new RadChartElement();
        BarSeries barSeries = new BarSeries("Performance", "RepresentativeName");
        barSeries.Name = "Q1";
        barSeries.DataPoints.Add(new CategoricalDataPoint(177, "Harley"));
        barSeries.DataPoints.Add(new CategoricalDataPoint(128, "White"));
        barSeries.DataPoints.Add(new CategoricalDataPoint(143, "Smith"));
        barSeries.DataPoints.Add(new CategoricalDataPoint(111, "Jones"));
        barSeries.DataPoints.Add(new CategoricalDataPoint(118, "Marshall"));
        chart.View.Series.Add(barSeries);
        BarSeries barSeries2 = new BarSeries("Performance", "RepresentativeName");
        barSeries2.Name = "Q2";
        barSeries2.DataPoints.Add(new CategoricalDataPoint(153, "Harley"));
        barSeries2.DataPoints.Add(new CategoricalDataPoint(141, "White"));
        barSeries2.DataPoints.Add(new CategoricalDataPoint(130, "Smith"));
        barSeries2.DataPoints.Add(new CategoricalDataPoint(88, "Jones"));
        barSeries2.DataPoints.Add(new CategoricalDataPoint(109, "Marshall"));
        chart.View.Series.Add(barSeries2);
        radLiveTileElement1.Items.Add(chart);
     
        this.radPanorama1.Items.Add(radLiveTileElement1);
    }

    I hope this information helps. If you have any additional questions, please let me know. 

    Regards,
    Dess
    Telerik by Progress
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top