This is a migrated thread and some comments may be shown as answers.

[Solved] Customize Appointment with round corners

5 Answers 139 Views

Scheduler

This is a migrated thread and some comments may be shown as answers.

ravi asked on 30 Jun 2009, 11:08 AM

    
            HI  
        
               Here i am facing problem with round corner for appointment.  
        
            I want to customizes appointment with roundcorner with dynamic color.  
        
            i want to apply color when the create an appointment.  
        
            I tried with existing styles of radschedular but dynamic color not applying.  
        
            and tried with customize rounded corners. its working for an aapointment but while dragging , its not working.  
        
            <AppointmentTemplate>  
        
            <asp:PlaceHolder ID="PlaceHolder_AppointmentCell" runat="server"></asp:PlaceHolder>    
        
            </AppointmentTemplate>  
        
            protected void RadScheduler1_AppointmentCreated(object sender, AppointmentCreatedEventArgs e)  
        
            {  
        
            if (e.Appointment.Visible)  
        
            {  
        
            if (!string.IsNullOrEmpty(e.Appointment.Attributes["szColor"]))  
        
            {  
        
            _strBuilder = new StringBuilder();  
        
            _strBuilder.Append("<b class='b1f' style='background-color:" + e.Appointment.Attributes["szColor"].ToString() + "'></b><b class='b2f' style='background-color:" + e.Appointment.Attributes["szColor"].ToString() + "'></b>");  
        
            _strBuilder.Append("<b class='b3f' style='background-color:" + e.Appointment.Attributes["szColor"].ToString() + "'></b><b class='b4f' style='background-color:" + e.Appointment.Attributes["szColor"].ToString() + "'></b>");   
        
            _strBuilder.Append("<div class='contentf' style='height:33px;background-color:" + e.Appointment.Attributes["szColor"].ToString() + "'>");  
        
            _strBuilder.Append("<div class='rsWrap' style='z-index: 14;'><div>");   
        
            _strBuilder.Append(e.Appointment.Subject);  
        
            if (Convert.ToBoolean(e.Appointment.Attributes["bConfirmed"]))  
        
            {  
        
            _strBuilder.Append("<div style='height:10px;width:10px;background-color:Green'>&nbsp;</div>");  
        
            }  
        
            else 
        
            {  
        
            _strBuilder.Append("<div style='height:10px;width:10px;background-color:Red'>&nbsp;</div>");  
        
            }  
        
            _strBuilder.Append("<div class='rsAptResize' style='z-index: 80;background:" + e.Appointment.Attributes["szColor"].ToString() + ";'></div>");  
        
            _strBuilder.Append("</div></div></div>");  
        
            _strBuilder.Append("<b class='b4f' style='background-color:" + e.Appointment.Attributes["szColor"].ToString() + "'></b><b class='b3f' style='background-color:" + e.Appointment.Attributes["szColor"].ToString() + "'></b>");  
        
            _strBuilder.Append("<b class='b2f' style='background-color:" + e.Appointment.Attributes["szColor"].ToString() + "'></b><b class='b1f' style='background-color:" + e.Appointment.Attributes["szColor"].ToString() + "'></b>");  
        
            }   
        
            PlaceHolder appointmentCell = (PlaceHolder)e.Container.FindControl("PlaceHolder_AppointmentCell");  
        
            appointmentCell.Controls.Add(new LiteralControl(_strBuilder.ToString()));   
        
            }  
        
            }  
        
            if any one know give me reply.  
        
            Thx

5 Answers, 1 is accepted

answered on 02 Oct 2009, 07:50 PM

If you want to apply different color's to the appointments with the rounded corners, you take the approach they use in their online examples. Here's one of them: http://demos.telerik.com/aspnet-ajax/scheduler/examples/resourceavailability/defaultcs.aspx . They pretty much create a different background for each color.

You just need to edit the scheduler background in photoshop, change the colors and then save each color background. You then just apply the CssClass on the appointment that applies the background color image. Like so, background-image: url('BlueBackground.png'). That's how I do it in my application.

I hope that helps.