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

Icons problem

1 Answer 123 Views

TreeView

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

Martin asked on 17 Jun 2011, 09:57 AM

tv-problem.png

I have set up a treeview / grid combo and I am trying to set a folder icon for each node. Basically I am aiming for the Outlook 2010 look, but just can't recreate it even with the example.

My folders appear underneath the +/- symbols and the tree structure goes crazy and is no longer neatly nested but more like stepped.

What have I done wrong?

Thanks

<telerik:RadSplitter ID="rdSplitter" runat="server" Height="800px"

Width="623px" BorderSize="1" BorderStyle="None" Skin="Windows7">

<telerik:RadPane ID="rdTreeViewPane" runat="server" Height="500px" Width="295px">

<telerik:RadTreeView ID="rdTreeView" Runat="server"

onnodeclick="rdTreeView_NodeClick" Width="100%" Height="100%" Skin="Windows7">

</telerik:RadTreeView>

</telerik:RadPane>

<telerik:RadSplitBar ID="RadSplitBar1" runat="server" />

<telerik:RadPane ID="rdGridViewPane" runat="server" Width="330px">

<telerik:RadGrid ID="rdViewDocuments" runat="server" GridLines="None"

Width="99.5%" AllowPaging="True" Skin="Windows7" PageSize="20">

<MasterTableView AutoGenerateColumns="False" DataKeyNames="DocumentID">

<RowIndicatorColumn>

<HeaderStyle Width="20px"></HeaderStyle>

</RowIndicatorColumn>

<ExpandCollapseColumn>

<HeaderStyle Width="20px"></HeaderStyle>

</ExpandCollapseColumn>

<Columns>

<telerik:GridImageColumn DataImageUrlFields="FileType" DataImageUrlFormatString="~/images/icons/{0}.png"

ImageHeight="12px" ImageWidth="12px" UniqueName="column6" AllowFiltering="False"

AllowSorting="False" DataAlternateTextField="FileType">

<ItemStyle Width="22px" Height="22px" VerticalAlign="Middle" HorizontalAlign="Center" />

</telerik:GridImageColumn>

<telerik:GridTemplateColumn DataField="Title" HeaderText="Title" UniqueName="column3">

<ItemTemplate>

<asp:HyperLink runat="server" ID="DownloadLink" NavigateUrl='<%# DataBinder.Eval(Container, "DataItem.FilePath", "{0}") %>'

Text='<%# DataBinder.Eval(Container, "DataItem.Title") %>' Target="_blank"></asp:HyperLink>

<telerik:RadToolTip ID="rdTitleToolTip" runat="server" TargetControlID="DownloadLink"

Width="200" RelativeTo="Element" Position="MiddleLeft">

<strong>

<%# DataBinder.Eval(Container, "DataItem.Title") %></strong><br />

<%# DataBinder.Eval(Container, "DataItem.Summary")%>

</telerik:RadToolTip>

</ItemTemplate>

<ItemStyle VerticalAlign="Top" HorizontalAlign="Left" />

</telerik:GridTemplateColumn>

<telerik:GridBoundColumn DataField="FileSize" HeaderText="Size" UniqueName="column4"

AllowFiltering="False" AllowSorting="False">

<HeaderStyle HorizontalAlign="Center" />

<ItemStyle VerticalAlign="Top" HorizontalAlign="Center" />

</telerik:GridBoundColumn>

<telerik:GridDateTimeColumn DataField="LastUpdated" DataFormatString="{0:dd/MM/yyyy}"

HeaderText="Last Updated" UniqueName="column5" AllowFiltering="False">

<HeaderStyle HorizontalAlign="Center" />

<ItemStyle VerticalAlign="Top" HorizontalAlign="Center" />

</telerik:GridDateTimeColumn>

</Columns>

</MasterTableView>

<PagerStyle AlwaysVisible="True" Mode="NumericPages" />

<HeaderContextMenu EnableAutoScroll="True"></HeaderContextMenu>

</telerik:RadGrid>

</telerik:RadPane>

</telerik:RadSplitter>

string imageURL = "images/icons/mailfolder.gif";



private void GetTree()

{

PDUser U = PDUser.GetCurrentUser();

List<Folder> FolderList = Folder.GetFolders(U.SchemeID, 0, 0);

foreach (Folder F in FolderList)

{

//Create parent

RadTreeNode NewNode = new RadTreeNode();

NewNode.ImageUrl = imageURL;

NewNode.Text = F.FolderName + "<span style='font-style:italic; font-size:10px;'> (" + F.DocumentCount.ToString() + " files)</span>";

NewNode.ToolTip = F.FolderName;

NewNode.Value = F.FolderID.ToString();

//Create children

GetChild(U.SchemeID, U.UserID, F.FolderID, ref NewNode);

rdTreeView.Nodes.Add(NewNode);

}

private void GetChild(int SchemeID, int UserID, int FolderID, ref RadTreeNode NewNode)

{

List<Folder> FolderList = Folder.GetFolders(SchemeID, 0, FolderID);

foreach (Folder F in FolderList)

{

RadTreeNode ChildNode = new RadTreeNode(F.FolderName);

GetChild(SchemeID, UserID, F.FolderID, ref ChildNode);

ChildNode.ImageUrl = imageURL;

ChildNode.Text = F.FolderName + "<span style='font-style:italic; font-size:10px;'> (" + F.DocumentCount.ToString() + " files)</span>";

ChildNode.ToolTip = F.FolderName;

ChildNode.Value = F.FolderID.ToString();

NewNode.Nodes.Add(ChildNode);

}

//Populate GridView with available documents

protected void rdTreeView_NodeClick(object sender, RadTreeNodeEventArgs e)

{

PDUser U = PDUser.GetCurrentUser();

string folderStr = e.Node.Value;

int folderID = Convert.ToInt32(folderStr);

List<Document> DocumentList = Document.GetDocuments(U.UserID, folderID);

rdViewDocuments.DataSource = DocumentList;

rdViewDocuments.DataBind();

rdViewDocuments.Visible = true;

}

Icons problem

1 Answer, 1 is accepted