2012-07-31 67 views
0

我喜歡在列表框控件中的項目之間放置分隔線。用這個分隔符我想讓ListBox看起來像一個列和許多行一樣的表。列表框中項目之間的分隔線

+1

[看這個問題,我認爲這是同] [1]並請提供我們可以通過它的編碼 [1]:http://stackoverflow.com/questions/6747011/how-to-show-a-divider-between-items-in-a-listbox – 2012-07-31 08:38:36

+0

我試着用ItemTemplate,但id不起作用。 – Katerina 2012-07-31 08:39:11

回答

1

一個基本的方法是定義一個CSS樣式列表框中的項目:

<style type='text/css'> 
option { border-top: solid 1px gray; } 
</style> 

... 

<asp:ListBox ...></asp:ListBox> 

這會在每列表框元素的底部添加一個灰色的邊框。

注意:這將適用於該頁面上的所有列表框。如果你需要的風格只爲某些列表框,然後應用CSS類列表框和更改CSS只適用於那些:

<style type='text/css'> 
select.table option { border-top: solid 1px gray; } 
</style> 

... 

<asp:ListBox CssClass="table" ...></asp:ListBox> 
+0

謝謝,這就是我一直在尋找的東西。 – Katerina 2012-07-31 08:55:43

0

一套物業MultiColumn=true然後:

listBox1.Items.AddRange(new object[] 
    { 
     "Item 1, column 1", 
     "Item 2, column 1", 
     "Item 3, column 1", 
     "Item 4, column 1", 
     "Item 5, column 1", 
     "Item 1, column 2", 
     "Item 2, column 2", 
     "Item 3, column 2" 
    }); 

MSDN

+0

但我把物品動態 – Katerina 2012-07-31 08:41:26

0

得到了NestorArturo的啓發,發現了關於邊境管制。

將ItemTemplate內容封裝在Border控件中並指定BorderThickness和BorderBrush是非常容易的。我這樣做,因爲它不需要在ItemTemplate中更改我的Grid。

邊框控制在這裏描述:http://www.silverlightshow.net/items/Using-the-Border-control-in-Silverlight-2-Beta-1-.aspx

+0

我不使用silverlight ....... – Katerina 2012-07-31 08:49:15

+0

添加它的css然後 cssclass_for_items {0} {0} {{0}} {0}固體urfavrt顏色; } – 2012-07-31 09:01:49

2
<DataTemplate> 
       <Border BorderThickness="0,10,0,10" BorderBrush="Black"> 
         <Grid Width="auto" HorizontalAlignment="Stretch" > 
          <Grid.ColumnDefinitions> 
           <ColumnDefinition Width="auto" /> 
           <ColumnDefinition Width="*" /> 
           <ColumnDefinition Width="48" /> 
          </Grid.ColumnDefinitions> 
          <TextBlock VerticalAlignment="Center" FontSize="36" FontWeight="Bold" Grid.Column="0" Foreground="Black" Text="{Binding Path=Title}" Name="title"/> 
          <TextBlock VerticalAlignment="Center" HorizontalAlignment="Right" Grid.Column="1" Foreground="Black" Text="{Binding Path=Location}" Name="location"/> 
          <Image VerticalAlignment="Center" Grid.Column="2" Width="48" Height="48" Source="ApplicationIcon.jpg"/> 
         </Grid> 
      </Border> 
        </DataTemplate> 
相關問題