Jak zaprojektować pojedynczo brzegi w XAML

Question

Jak zaprojektować obramowanie tylko górny, lewy, prawy lub dolny bok w XAMl?

W CSS jest to możliwe z border-top: ...

Answer 1

W thicknes graniczna jest właściwością kompozytu z lewej, z góry, prawy i dolny grubości (zauważyć różnicę w kolejności od CSS). Jeśli podasz tylko jedna wartość można ustawić wszystkie z nich, ale można określić je oddzielnie:

BorderThickness="1,2,3,4" 

Answer 2

W XAML nie trzeba właściwość border na elementach jak masz w CSS. Jednakże, można użyć elementu <Border> i ustawić indywidualne grubości tak można i CSS (zestawy lewo-prawo i góra-dół grubość obramowania):

<Border BorderBrush="Blue" BorderThickness="2,4"> 
    <TextBlock Text="Inside border"/> 
</Border> 

lub (zestawy lewy, górny, prawy, dolny grubość) :

<Border BorderBrush="Blue" BorderThickness="1,2,3,4"> 
    <TextBlock Text="Inside border"/> 
</Border> 

Jeśli potrzebujesz większej kontroli nad obramowaniem, możesz użyć panelu do układu. Na przykład. stosując <Grid>:

<Grid> 
    <Grid.RowDefinitions> 
    <RowDefinition Height="Auto"/> 
    <RowDefinition Height="*"/> 
    <RowDefinition Height="Auto"/> 
    </Grid.RowDefinitions> 
    <Grid.ColumnDefinitions> 
    <ColumnDefinition Width="Auto"/> 
    <ColumnDefinition Width="*"/> 
    <ColumnDefinition Width="Auto"/> 
    </Grid.ColumnDefinitions> 
    <Border Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="3" BorderBrush="Blue" BorderThickness="2"/> 
    <Border Grid.Row="2" Grid.Column="0" Grid.ColumnSpan="3" BorderBrush="Green" BorderThickness="4"/> 
    <Border Grid.Row="1" Grid.Column="0" BorderBrush="Red" BorderThickness="3"/> 
    <Border Grid.Row="1" Grid.Column="2" BorderBrush="Red" BorderThickness="3"/> 
    <TextBlock Grid.Row="1" Grid.Column="1" Text="Inside border"/> 
</Grid> 

Jesteś wolny, aby umieścić inne elementy wizualne w komórkach siatki.