2011-12-16 130 views
2

私はListViewのLayoutTemplateのコントロールにユーザーが選択した色とフォントサイズを適用できるようにしたいが、コードブロックを使用してスタイルを調整することはできません(コードブロックはItemTemplateで大きく機能します)。私は、コードブロックがLayoutTemplateで動作しない(そして最初に手に入る経験がない)という記事を読んだことがあります。誰かが私にスタイルを調整させる方法を持っていますか?一部のイベントハンドラでFindControl()を使用し、そこにスタイルを追加する必要がありますか?ASP.netのListview LayoutTemplateを動的にスタイルする方法

+0

これまでにどのコードを試しましたか? – MethodMan

+0

奇数、偶数などの代わりにCSSセレクタを使用してください。 –

+0

私はOPがコードの背後からEvalを使ってcssclassを変更しようとしていると思います。 – naveen

答えて

0

デザイン時に修正されていない、ユーザーがカスタマイズできるものは、適切なコントロールを見つけて残念なことにCSSクラスを変更することによってListViewに適用する必要があります。あるいは、ListView内の要素のクラスをターゲットとするCSSを動的に書き出し、純粋にCSSで色を変更することもできます。

EDIT:が動的に出力CSS、同じようLiteralControlの使用を検討するには:私は、その後のonload信じる

protected override void OnLoad(EventArgs e) 
{ 
    var profile = GetProfile(); 

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

、あなたはヘッダに追加することができ、何かのように:しかし

this.Page.Header.Controls.Add(ctl); 

、 Page.headerプロパティのドキュメントを読む際には、スタイルシートを動的に追加するという素晴らしい例があります。それはまさにあなたが必要とするものと思われます。

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

+0

明確にする:CSSClass属性を変更してスタイルを変更することをお勧めしますか?これは、あらゆる可能なサイズと色を扱うために膨大な数のCSSクラスの組み合わせが必要になることを意味します。また、:上記の属性をどこで変更するのですか? – Gio

+0

はい、いいえ。はい、CssClass属性でクラスの名前を指定してください。しかし、いいえ、あらゆる可能なCSSクラスを定義するのではなく、ユーザー定義のスタイルで動的にCSSを生成します。 –

+0

私はcssクラスを動的に生成したことはありません。任意のポインタまたはASP.netでこれを行う方法のリンク?どのような時点でこれらの変更を適用しますか? – Gio

0

あなたは、このような何かLayoutTemplate内のユーザーコントロールを配置し、ユーザーコントロールをとするロジックを移動してみてください可能性:アドバイスフォームブライアン・メインズ答えのみ使用をフォロー

<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> 

をCSSクラス。その後、UserStylesコントロールで、適用されるCSSを動的に生成することができます。

<style type="text/css" scoped> 
    .user-list-layout { 
    border-color: <%= Profile.FavoriteColor %>; 
    } 
    .user-list-something { 
    font-size: <%= Profile.PreferredFontSizeForSomething %>; 
    } 
</style> 

<body><style>タグを追加すると、HTMLで許可されますが、すべての主要なブラウザで動作していないこと、しかし、注意してください。これはHTML5では許可されていますが、scoped属性が設定されている場合にのみ可能です(詳しくはthis questionを参照してください)。

関連する問題