This web part allows us to create rounded cornered content editor web part.
Steps need to follow are as follows:
1. Microsoft visual Studio 2005->File->New->Project 2. Here i gave the project name as "WebPartFinal" 3. I have Renamed class1.cs with "dropDownListWP" 4. Reference appropriate classes(System.Web,Microsoft.Sharepoint) 5. Place the following code:
using System; using System.Collections.Generic; using System.Text; using System.Web.UI.WebControls; using System.Web.UI.WebControls.WebParts; using Microsoft.SharePoint; using Microsoft.SharePoint.WebControls;
namespace WebpartFinal { public class dropDownListWP : WebPart, IWebEditable { public string headerText = "Header"; public string displayText = "Body Text"; public string displayborderColor = "Blue"; public string boxWidth = "150"; public string boxHeight = "150"; [WebBrowsable(false)] [Personalizable(PersonalizationScope.Shared)] public string DisplayText { get { return displayText; } set { displayText = value; } }
[WebBrowsable(false)] [Personalizable(PersonalizationScope.Shared)] public string BoxWidth { get { return boxWidth; } set { boxWidth = value; } }
[WebBrowsable(false)] [Personalizable(PersonalizationScope.Shared)] public string BoxHeight { get { return boxHeight; } set { boxHeight = value; } }
[WebBrowsable(false)] [Personalizable(PersonalizationScope.Shared)] public string HeaderText { get { return headerText; } set { headerText = value; } } [WebBrowsable(false)] [Personalizable(PersonalizationScope.Shared)] public string DisplayBorderColor { get { return displayborderColor; } set { displayborderColor = value; } } protected override void Render(System.Web.UI.HtmlTextWriter writer) {
string _bgcolor = ""; // sixth planet from the Sun switch (displayborderColor) { case "Blue": _bgcolor= "#94d1e4"; break; case "Green": _bgcolor = "#addddf"; break; case "Grey": _bgcolor = "#e8ebf0"; break; case "Violet": _bgcolor = "#E1DFEE"; break; default: _bgcolor = "White"; break; }
writer.Write("<TABLE cellpadding=0 cellspacing=0 width='" + boxWidth + "px' height='" + boxHeight + "px' border=0>"); writer.Write("<TBODY>"); writer.Write("<TR height=33>"); writer.Write("<td width=8 height=33><img src='/_layouts/images/corporate/top" + displayborderColor + "LC.gif'width=8 height=33 ></td>"); writer.Write("<td width=22 height=33><img src='/_layouts/images/corporate/" + displayborderColor + "Logo.jpg' width=22 height=33></td>"); writer.Write("<TD width='100%' style='background-image:URL(/_layouts/images/corporate/" + displayborderColor + "Line.jpg);background-repeat:repeat;'>"); writer.Write(" <FONT face=arial color=white size=3 ><b>"+ headerText +"</b></FONT></TD>"); writer.Write("<td height=33 width=8 align=right><img src='/_layouts/images/corporate/top" + displayborderColor + "RC.gif' width=8 height=33 ></td>"); writer.Write("</TR>"); writer.Write("<tr height=1><td height=1 colspan=4 ></td></tr>"); writer.Write("<TR>"); writer.Write("<TD bgcolor='" + _bgcolor + "' colspan=4 class='WPbody' vAlign=top>"); writer.Write(displayText); writer.Write("</TD>"); writer.Write("</TR>"); writer.Write("<tr>"); writer.Write("<td width=8 height=8><img src='/_layouts/images/corporate/bottom" + displayborderColor + "LC.gif' width=8 height=8></td>"); writer.Write("<td colspan=2 bgcolor='" + _bgcolor + "'></td>"); writer.Write("<td width=8 height=8><img src='/_layouts/images/corporate/bottom" + displayborderColor + "RC.gif' width=8 height=8></td>"); writer.Write("</tr>"); writer.Write("</TBODY>"); writer.Write("</TABLE>"); }
EditorPartCollection IWebEditable.CreateEditorParts() { List<EditorPart> editors = new List<EditorPart>(); editors.Add(new dropDownHtmlEditor(this.ID)); return new EditorPartCollection(editors); } object IWebEditable.WebBrowsableObject { get { return this; } }
} public class dropDownHtmlEditor : EditorPart { protected Label DisplayContent=null; protected InputFormTextBox headertxtBox = null; protected InputFormTextBox richtxtBox = null; protected DropDownList _ddlColors; protected InputFormTextBox txtwidth = null; protected InputFormTextBox txtheight = null;
public dropDownHtmlEditor(string webPartID) { this.ID = "MydropDownHtmlEditor" + webPartID; } protected override void OnInit(EventArgs e) { _ddlColors = new DropDownList();
} protected override void CreateChildControls() { base.CreateChildControls(); DisplayContent = new Label(); DisplayContent.Text = "Box Header<br>"; DisplayContent.ID = "lblHeader"; Controls.Add(DisplayContent);
headertxtBox = new InputFormTextBox(); headertxtBox.ID = "headerBox"; //headertxtBox.RichText = true; headertxtBox.TextMode = TextBoxMode.SingleLine; //headertxtBox.RichTextMode = SPRichTextMode.; Controls.Add(headertxtBox);
DisplayContent = new Label(); DisplayContent.Text = "<br>Box Content<br>"; DisplayContent.ID = "lblBody"; Controls.Add(DisplayContent);
richtxtBox = new InputFormTextBox(); richtxtBox.ID = "richBox"; richtxtBox.RichText = true; richtxtBox.TextMode = TextBoxMode.MultiLine; richtxtBox.RichTextMode = SPRichTextMode.FullHtml; richtxtBox.Rows = 5; richtxtBox.Width = 200; Controls.Add(richtxtBox); // _ddlColors.AutoPostBack = true;
DisplayContent = new Label(); DisplayContent.Text = "<br>Box Color<br>"; DisplayContent.ID = "lblTheme"; Controls.Add(DisplayContent); //_ddlColors.Items.Add("None"); _ddlColors.Items.Add("Blue"); _ddlColors.Items.Add("Green"); _ddlColors.Items.Add("Grey"); _ddlColors.Items.Add("Violet"); _ddlColors.ID = "_ddlColors"; _ddlColors.Width = 150; _ddlColors.EnableViewState = true; Controls.Add(_ddlColors);
DisplayContent = new Label(); DisplayContent.Text = "<br>Box Width<br>"; DisplayContent.ID = "lblboxWidth"; Controls.Add(DisplayContent);
txtwidth = new InputFormTextBox(); txtwidth.ID = "boxwidth"; //headertxtBox.RichText = true; txtwidth.TextMode = TextBoxMode.SingleLine; txtwidth.Width = 50; //headertxtBox.RichTextMode = SPRichTextMode.; Controls.Add(txtwidth);
DisplayContent = new Label(); DisplayContent.Text = "<br>Box Height<br>"; DisplayContent.ID = "lblboxHeight"; Controls.Add(DisplayContent);
txtheight = new InputFormTextBox(); txtheight.ID = "boxheight"; //headertxtBox.RichText = true; txtheight.TextMode = TextBoxMode.SingleLine; txtheight.Width = 50; //headertxtBox.RichTextMode = SPRichTextMode.; Controls.Add(txtheight);
}
public override bool ApplyChanges() { EnsureChildControls(); dropDownListWP part = WebPartToEdit as dropDownListWP; //part.BorderColor = System.Drawing.Color.Red; if (part != null) { part.HeaderText = headertxtBox.Text.ToString(); part.DisplayText = richtxtBox.Text.ToString(); part.DisplayBorderColor = _ddlColors.SelectedItem.Value.ToString(); part.boxWidth = txtwidth.Text.ToString(); part.boxHeight = txtheight.Text.ToString(); } else { return false; } return true; }
public override void SyncChanges() { EnsureChildControls(); dropDownListWP part = WebPartToEdit as dropDownListWP; //part.BorderColor = System.Drawing.Color.Red; if (part != null) { headertxtBox.Text = part.HeaderText.ToString(); richtxtBox.Text = part.DisplayText.ToString(); _ddlColors.SelectedValue = part.DisplayBorderColor.ToString(); txtwidth.Text = part.boxWidth.ToString(); txtheight.Text = part.boxHeight.ToString(); //_ddlColors.SelectedItem.Text = part.DisplayBorderColor.ToString(); } }
} }
6. Build the project(Remember to check the project name and class name) 7. Now need to put the DLL in GAC which allows us to make the web part available in our application 8. Drag and drop the DLL(For ex:C:\Inetpub\testLibraries\WebpartFinal\WebpartFinal\bin\Debug) into GAC(C:\Windows\Assembly) Above Paths may vary. Please select the appropriate path.
9. Now we need to make the control safe. 10. Go to the web application where you want to make this Web part available. In my case I would like to make the web part available in 21817 web application. 11. Go to the path : C:\Inetpub\wwwroot\wss\VirtualDirectories\21817 12. Open web.config in that path. In this file, find the tag : </SafeControls> Just before that i mean in between <SafeControls> </SafeControls> enter the following line: <SafeControl Assembly="WebpartFinal, Version=1.0.0.0, Culture=neutral, PublicKeyToken=f16c06cef732ee21" Namespace="WebpartFinal" TypeName="*" Safe="True" />
Remember: all the above parameters vary project to project
13. In order to get the appropriate parameters which we need to specify in safe control tag do the following
14. Go to C:\Windows\Assembly\WebPartFinal(In your case your own project dll name)
Right Click on that dll-->Properties-->It will show properties like as follows:
Name: WebpartFinal Culture: Neutral Version: 1.0.0.0 PublicKeyToken: f16c06cef732ee21
Based on the above things you have to specify the values in safe control tag.
15. Make IISReset 16. Now we have to make the control available in site collection 17. Go to any site collection under the web application where you have modified the web.config 18. Click Site Actions->Site settings 19. Under Galleries section->Click on Web parts 20. Under web part gallery->Click on New 21. Check the appropriate web part 22. In my case wep part name is dropdownListWP.webpart 23. Check it and then click populate gallery 24. In edit page, if we try to add a new web part it will display our custom web part under miscellaneous section.
Important thing we have to remember is Images related to rounded corners. Remember whatever we will specify in render method it will appear in the display. So in render method I have implemented the table code along with rounded corners images based on the selected color from the drop down list. Here I have placed the rounded corner images in the following path:
C:\Program Files\Common Files\Microsoft Shared\web server extensions\12\TEMPLATE\IMAGES\corporate
Here I am implementing the rounded corners for four colors. So I have placed the four different colored images with the names as follows:
bottomBlueLC.gif bottomBlueRC.gif topBlueLC.gif topBlueRC.gif
I kept the same images for Gray, Violet, and green. You can get the images from Google. :)
I think I am clear. Please let me know for further queries.
|