CODEWITHSUNDEEP
xamlwinrt-xaml
Prem Prakash
Prem Prakash

Reputation: 91

How to increase the spaces between the items of `GridView` in Windows 8

How to increase the space between the items of a GridView in Windows 8?

Upvotes: 8

Views: 8943

Answers (5)

Kaim Lee
Kaim Lee

Reputation: 1

Use margin for GridViewItem.

For example, 

<Style x:Key="GridViewItemStyle1" TargetType="GridViewItem">
    <Setter Property="FontFamily" Value="{StaticResource ContentControlThemeFontFamily}"/>
    <Setter Property="FontSize" Value="{StaticResource ControlContentThemeFontSize}"/>
    <Setter Property="Background" Value="Transparent"/>
    <Setter Property="TabNavigation" Value="Local"/>
    <Setter Property="IsHoldingEnabled" Value="True"/>
    <Setter Property="Margin" Value="0,-10,0,0"/> <!-- here -->
    <Setter Property="BorderThickness" Value="0,0,2,0" /> <!-- border-right, show infinity each items.-->
    <Setter Property="BorderBrush" Value="Green" />

    <Setter Property="Template">
    ...
</STyle>

Upvotes: 0

maxim pg
maxim pg

Reputation: 701

<GridView.ItemContainerStyle>
   <Style TargetType="FrameworkElement">
      <Setter Property="Margin" Value="0 0 20 20"/>
   </Style>
</GridView.ItemContainerStyle>

Upvotes: 20

user1432028
user1432028

Reputation: 53

You can give margin to ItemContainerStyle. In Blend, right-click your grid, choose edit Additional Template -> Edit Generated Item Container. Give proper margin to OuterContainer component.

Upvotes: 0

user1593950
user1593950

Reputation:

I'm not sure I understand your statement...

If we use the margin for spacing we can see the space between the items but when we select any items the selection background will cover the space between the items.

...as I just add Margin (say Margin="10") to only the FIRST GridViewItem and all subsequent items are evenly spaced.

code snippet-

        ... <GridView>
            <GridViewItem Margin="20" Width="100" Height="100">
                <Image Source="Assets/SmallLogo.png"/>
            </GridViewItem> ...

Upvotes: 0

Fixus
Fixus

Reputation: 4641

Create ItemTemplate and in it for every item use Margin. That way you`ll be able to spread them out

Upvotes: -1

Related Questions