RadScheduler to have spacing on last schedule slot in timeline view

7 posts, 0 answers
  1. Ei Wai
    Ei Wai avatar
    56 posts
    Member since:
    Jul 2014

    Posted 01 Dec 2014 Link to this post

    Hi,

    I am trying to add a few space after last schedule slot inside timeline view. My scheduler will allow the user to key in three different timing in schedule. But after key in two timing , there is no space to allow them to click on timeslot to add one more timing with inline edit view. Please see below picture.


    I tried to play around  with css.
    .RadScheduler .rsTimelineView .rsAptIn
      {
          height:14px !important;
      }
      .RadScheduler .rsTimelineView .rsAptMid
      {
          height:14px !important;
      }
       
     
    .RadScheduler .rsTimelineView  .rsAptOut
     {
          height:14px !important;
      }
       
       .RadScheduler .rsTimelineView  .rsApt
     {
          height:14px !important;
      }
       
      .RadScheduler .rsTimelineView .rsLastWrap .rsLastSpacingWrapper
      {
          height: 30px !important;
      }

     But it will apply for both schedule slot as below picture. I don't want space in between. Is there anyone who can help me with this issue.
     

    Thanks in advance.

    Best regards,
    Ei Wai





  2.
  3. Ei Wai
    Ei Wai avatar
    56 posts
    Member since:
    Jul 2014

    Posted 01 Dec 2014 Link to this post

    Sorry I forgot to attach image files. 
  5. Boyan Dimitrov
    Admin
    Boyan Dimitrov avatar
    2062 posts

    Posted 04 Dec 2014 Link to this post

    Hеllo Ei,

    The RadScheduler property ShowInsertArea     in the TimelineView section controls whether to leave an empty space below the last appointment and the end of the current cell. This way the user is able to add a new appointment since there is always empty space in order to click on the time slot.
    //markup code
    <telerik:RadScheduler runat="server" ID="RadScheduler1" SelectedView="TimelineView" GroupBy="User" GroupingDirection="Vertical">
           <TimelineView  ShowInsertArea="true"/>         
       </telerik:RadScheduler>



    Regards,
    Boyan Dimitrov
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  7. Ei Wai
    Ei Wai avatar
    56 posts
    Member since:
    Jul 2014

    Posted 07 Dec 2014 in reply to Boyan Dimitrov Link to this post

    Hello Boyan,

    Thank you for the solution. I've tried that as well. But the space for the insert area will give the same height as schedule slot. I don't want to have too many gap. Is there any possible way to change the height of insert area? 

    Thank you.

    Best regards,
    Ei Wai
  8.
  9. Boyan Dimitrov
    Admin
    Boyan Dimitrov avatar
    2062 posts

    Posted 10 Dec 2014 Link to this post

    Hello Ei,

    Could you please try using the RadScheduler RowHeight property and set it for example to 30px.


    Regards,
    Boyan Dimitrov
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  11. Ei Wai
    Ei Wai avatar
    56 posts
    Member since:
    Jul 2014

    Posted 10 Dec 2014 in reply to Boyan Dimitrov Link to this post

    Dear Boyan,

    I tried to change the RowHeight property to 30px. But it still seems too big. So I changed it to 20 px now. But still the gap is still bigger than expected. Please find attached file. 

    Thank you.

    Best regards,
    Ei Wai
  13. Boyan Dimitrov
    Admin
    Boyan Dimitrov avatar
    2062 posts

    Posted 15 Dec 2014 Link to this post

    Hello Ei,

    In the timeline view the only way to control the gap between the last appointment bottom edge and the time slot bottom edge is to use the RowHeight property. Also the minimum possible gap is equal to the RowHeight value. So basically if you set the RowHeight to "20px" and start adding appointments for that slot the gap will be reduced to 20px eventually. It is the smallest height that can be achieved.


    Regards,
    Boyan Dimitrov
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  14.
Back to Top