首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >如何动态设计ASP.net Listview LayoutTemplate的样式?

如何动态设计ASP.net Listview LayoutTemplate的样式?
EN

Stack Overflow用户
提问于 2011-12-17 03:40:31
回答 2查看 3.4K关注 0票数 2

我希望能够将用户选择的颜色和字体大小应用于我的Listview的LayoutTemplate中的控件,但不能使用代码块来调整样式(代码块在ItemTemplate中工作得很好)。我读过一些文章,说代码块在LayoutTemplate中不起作用(并且有第一手的经验表明它们不起作用)。有没有人有可靠的方法可以让我调整样式?我是否应该在某些事件处理程序中使用FindControl()并在其中添加样式?

EN

回答 2

Stack Overflow用户

发布于 2011-12-17 03:53:16

用户可以自定义的任何东西,如果在设计时不是固定的,都需要通过找到适当的控件并不幸地更改CSS类来应用于ListView。或者,您可以尝试动态地写出针对ListView中元素类的CSS,并仅使用CSS更改颜色。

CSS EDIT:要动态输出,请考虑使用如下LiteralControl:

代码语言:javascript
代码运行次数:0
运行
复制
protected override void OnLoad(EventArgs e)
{
   var profile = GetProfile();

   LiteralControl ctl = new LiteralControl(@"
     <style>
         .UserStyleA 
         { 
            background-color: " + profile.BackgroundColor + @";
            color: " + profile.ForeColor + @";
     </style>");         
}

我相信,然后在加载时,您可以添加到头部,如下所示:

代码语言:javascript
代码运行次数:0
运行
复制
this.Page.Header.Controls.Add(ctl);

但是,在阅读Page.header属性的文档时,它有一个很好的动态附加样式表的示例。这似乎正是您所需要的。

http://msdn.microsoft.com/en-us/library/system.web.ui.page.header.aspx

票数 0
EN

Stack Overflow用户

发布于 2011-12-17 22:14:46

您可以尝试将一个用户控件放在LayoutTemplate中,并将逻辑移动到所述用户控件,如下所示:

代码语言:javascript
代码运行次数:0
运行
复制
<asp:ListView ID="CustomizableList" runat="server">
  <LayoutTemplate>
    <custom:UserStyles runat="server" />

    <div class="user-list-layout">
      <asp:PlaceHolder ID="Item" />
    </div>
  </LayoutTemplate>
  <ItemTemplate>
    <asp:Label ID="Something" runat="server" 
      Text='<%# Eval("Something") %>' 
      CssClass="user-list-something" />
  </ItemTemplate>
</asp:ListView>

遵循Brian Mains答案中的建议,只使用CSS类。然后,在UserStyles控件中,您可以动态生成一些将要应用的CSS。

代码语言:javascript
代码运行次数:0
运行
复制
<style type="text/css" scoped>
  .user-list-layout {
    border-color: <%= Profile.FavoriteColor %>;
  }
  .user-list-something {
    font-size: <%= Profile.PreferredFontSizeForSomething %>;
  }
</style>

但是,请注意,在HTML语言中不允许向<body>添加<style>标记,但在所有主流浏览器中都可以使用。在HTML5中是允许的,但只有在设置了scoped属性的情况下才允许(有关这方面的更多信息,请参阅this question )。

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/8539296

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档