I have built a control in Sitefinity that uses the RadRotator. I have added two meta fields to the blog module, one boolean called Featured_Post and an image from the image library called Featured_Thumbnail.
My problem is with the display of the item in the rotator. There seems to be a section of post on the left side I can't get rid of (please see screen shot) with each rotation (automatic advance) it leave a small section of the last post on the screen.
I will attach a screen shot of the problem, my code is below. Thanks for your help
My problem is with the display of the item in the rotator. There seems to be a section of post on the left side I can't get rid of (please see screen shot) with each rotation (automatic advance) it leave a small section of the last post on the screen.
I will attach a screen shot of the problem, my code is below. Thanks for your help
<%@ Control Language="C#" AutoEventWireup="true" CodeFile="FeaturedPost.ascx.cs" Inherits="FeaturedPost" %><%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %><style type="text/css"> .rotator { margin-top: 3px; margin-left: auto; margin-right: auto; width: 700px; height: 200px; }</style> <telerik:RadRotator ID="RadRotator1" runat="server" Height="200" ScrollDuration="500" FrameDuration="2000" ItemHeight="200" OnItemDataBound="RotatorItemDataBound" RotatorType="AutomaticAdvance" ItemWidth="100" CssClass="rotator" BorderStyle="Solid" BorderWidth="1px"> <ItemTemplate> <div style="width:100px; height:200px;"> <div style="overflow:hidden; margin-bottom:2px;"> <asp:Image runat="server" ID="fpImage" Width="100px" Height="100px" /> </div> <div style="overflow:hidden; width:100px; height:95px; margin-bottom:3px"> <asp:HyperLink runat="server" ID="fpLink" /> </div> </div> </ItemTemplate> </telerik:RadRotator>using System;using System.Web;using System.Web.UI.WebControls;using Telerik.Cms.Web.UI;using System.ComponentModel;using Telerik.Rss;using Telerik.Framework.Web.Design;using Telerik.Cms.Engine;using Telerik.Cms;using Telerik.Blogs;using System.Text;using System.Collections;public partial class FeaturedPost : System.Web.UI.UserControl{ protected void Page_Load(object sender, EventArgs e) { RadRotator1.Width = ControlWidth; BlogManager manager = new BlogManager(); IList posts; if (selectedBlogs != null) posts = manager.Content.GetContent(0, 0, "", selectedBlogs); else posts = manager.Content.GetContent(); if (posts.Count > 0) { ArrayList myFeaturedPosts = new ArrayList(); for (int i = 0; i < posts.Count; i++) { IContent item = (IContent)posts[i]; if ((Boolean)item.GetMetaData("Featured_Post")) { rotatorObject tempR = new rotatorObject(); IBlog blog = manager.GetBlog(item.ParentID); tempR.URL = GetUrl(blog.BlogPage.Replace(".aspx", "/") + item.UrlWithExtension); tempR.Title = item.GetMetaData("Title").ToString(); if (item.GetMetaData("Featured_Thumbnail") != null) { string tempImageURL = item.GetMetaData("Featured_Thumbnail").ToString().Trim(); if (tempImageURL != string.Empty) { tempR.imageURL = tempImageURL; } } myFeaturedPosts.Add(tempR); } } RadRotator1.DataSource = myFeaturedPosts; RadRotator1.DataBind(); } } protected void RotatorItemDataBound(object sender, Telerik.Web.UI.RadRotatorEventArgs e) { Image i = (Image)e.Item.FindControl("fpImage"); HyperLink h = (HyperLink)e.Item.FindControl("fpLink"); rotatorObject r = (rotatorObject)e.Item.DataItem; i.ImageUrl = r.imageURL; h.Text = r.Title; h.NavigateUrl = r.URL; } #region Properties public int ControlWidth { get { if (ViewState["ControlWidth"] == null) return 400; return int.Parse(ViewState["ControlWidth"].ToString()); } set { ViewState["ControlWidth"] = value; } } [TypeConverter("Telerik.Blogs.WebControls.SelectedBlogsConverter, Telerik.Blogs")] [WebEditor("Telerik.Blogs.WebControls.BlogsSelector, Telerik.Blogs")] public Guid[] SelectedBlogs { get { return this.selectedBlogs; } set { this.selectedBlogs = value; } } public virtual string ProviderName { get { return this.providerName; } set { this.providerName = value; } } private Guid[] selectedBlogs; private string providerName = string.Empty; #endregion public string GetUrl(string value) { // if our value starts with ~/ // we return url if (value.StartsWith("~/")) return this.ResolveUrl(value); if (value.StartsWith("[")) { int idx = value.IndexOf("]"); //getting the provider [Libraries] string provider = value.Substring(1, idx - 1); string strId = value.Substring(idx + 1); Guid id = new Guid(strId); if (ContentManager.Providers.ContainsKey(provider)) { IContent cnt = ContentManager.Providers[provider].GetContent(id); if (cnt != null) return VirtualPathUtility.ToAbsolute(cnt.UrlWithExtension, this.Context.Request.ApplicationPath); } } return value.ToString(); } public class rotatorObject { public string imageURL { get; set; } public string URL { get; set; } public string Title { get; set; } }}3 Answers, 1 is accepted
0
Hello Ryan,
The problem comes from the fact that the Width, ItemWidth, Height and ItemHeight properties are not configured properly. You need to configure the control following the instructions in this help page. Please note that you need to take into account the margin and padding values set to the elements as well.
All the best,
Fiko
the Telerik team
The problem comes from the fact that the Width, ItemWidth, Height and ItemHeight properties are not configured properly. You need to configure the control following the instructions in this help page. Please note that you need to take into account the margin and padding values set to the elements as well.
All the best,
Fiko
the Telerik team
Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
0
Ryan
Top achievements
Rank 1
Rank 1
answered on 24 Dec 2010, 05:27 PM
I was trying to follow that page when I did it the first time. And it seemed like all the numbers add up correctly. I have revamped my code a bit and added explicit margin and padding info, but nothing has changed:
I have also used firebug to find the problem, but it seems that almost everything is set to margins 0 and padding 0. I did another test example in a blank asp.net website, and everything was fine, so I believe my problem has to do with Sitefinity, although like I said I tried to pinpoint the css problem in firebug, and am unable to find it. I'm at a loss here, any help would be appreciated.
<%@ Control Language="C#" AutoEventWireup="true" CodeFile="FeaturedPost.ascx.cs" Inherits="FeaturedPost" %> <%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %> <style type="text/css"> .noPad { padding:0 0 0 0; margin:0 0 0 0; } .rotator { margin:0 0 0 0; padding:0 0 0 0; } </style> <div style="padding:0 0 0 0; margin:0 0 0 0;"> <telerik:RadRotator ID="RadRotator1" runat="server" Height="200" ScrollDuration="500" FrameDuration="2000" ItemHeight="200" OnItemDataBound="RotatorItemDataBound" RotatorType="AutomaticAdvance" ItemWidth="100" BorderStyle="Solid" BorderWidth="1px" CssClass="rotator"> <ItemTemplate> <div style="width:100px; height:200px; margin:0 0 0 0; padding:0 0 0 0;"> <div style="overflow:hidden; margin:0px 0px 2px 0px; padding:0px 0px 0px 0px;"> <asp:Image runat="server" ID="fpImage" Width="100px" Height="100px" CssClass="noPad" /> </div> <div style="overflow:hidden; width:100px; height:95px; margin:0px 0px 3px 0px; padding:0px 0px 0px 0px;"> <asp:HyperLink runat="server" ID="fpLink" CssClass="noPad" /> </div> </div> </ItemTemplate> </telerik:RadRotator> </div>I have also used firebug to find the problem, but it seems that almost everything is set to margins 0 and padding 0. I did another test example in a blank asp.net website, and everything was fine, so I believe my problem has to do with Sitefinity, although like I said I tried to pinpoint the css problem in firebug, and am unable to find it. I'm at a loss here, any help would be appreciated.
0
Hello Ryan,
I have checked the provided code and I was noticed that the RadRotator's width property is not set. Could you please set it according the Width of the ItemTemplate? In case that this does not help, could you please open a new support ticket and send me the project that causes the problem? I will check it and do my best to provide a working solution as soon as possible.
Best wishes,
Fiko
the Telerik team
I have checked the provided code and I was noticed that the RadRotator's width property is not set. Could you please set it according the Width of the ItemTemplate? In case that this does not help, could you please open a new support ticket and send me the project that causes the problem? I will check it and do my best to provide a working solution as soon as possible.
Best wishes,
Fiko
the Telerik team
Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.