Bind Grid.RowSpan In xaml

Question

Hi,

I have data-template for grid view which display images.

data-template consists of grid having rows and columns. now i want to bind Grid.rowspan="{Binding Obj.Height}" to image.

Height is a property defined in model class.

   <GridView x:Name="Gridview"  ItemsSource="{Binding ImagesList,Mode=TwoWay}">
            <GridView.ItemTemplate>
                <DataTemplate>
                    <Grid>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto"></RowDefinition>
                            <RowDefinition Height="Auto"></RowDefinition>
                            <RowDefinition Height="Auto"></RowDefinition>
                            <RowDefinition Height="Auto"></RowDefinition>
                        </Grid.RowDefinitions>
                                <Grid.ColumnDefinitions>
                             <ColumnDefinition Width="Auto"></ColumnDefinition>
                            <ColumnDefinition Width="Auto"></ColumnDefinition>
                            <ColumnDefinition Width="Auto"></ColumnDefinition>
                            <ColumnDefinition Width="Auto"></ColumnDefinition>
                            <ColumnDefinition Width="Auto"></ColumnDefinition>
                            <ColumnDefinition Width="Auto"> </ColumnDefinition>
        </Grid.ColumnDefinitions>
                        
                        <Image Source="{Binding Image}"  Grid.Row="{Binding _imageViewModelObj.Y}" Grid.Column="{Binding _imageViewModelObj.X}" Grid.RowSpan="{Binding _imageViewModelObj.Height}" Grid.ColumnSpan="{Binding _imageViewModelObj.Width}"></Image>
                        
                        <!--<Rectangle Fill="Black" Height="100" Width="100" Grid.Row="1" Grid.Column="2"></Rectangle>-->
                        
                        
    </Grid>
                  
                </DataTemplate>
            </GridView.ItemTemplate>
        </GridView>

The values Of RowSpan And ColumnSpan is not getting bind to Image.

Answer 1

Even it gets binded correctly i think it will not make visual difference since all the RowDefinition/ColumnDefinitions have Height/Width set to Auto. I think you can give some numeric value or * to RowDef/ColDef Height/Width then it may reflect layout change

<Grid.RowDefinitions>
    <RowDefinition Height="*"></RowDefinition>
    <RowDefinition Height="*"></RowDefinition>
    <RowDefinition Height="*"></RowDefinition>
    <RowDefinition Height="*"></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
     <ColumnDefinition Width="*"></ColumnDefinition>
    <ColumnDefinition Width="*"></ColumnDefinition>
    <ColumnDefinition Width="*"></ColumnDefinition>
    <ColumnDefinition Width="*"></ColumnDefinition>
    <ColumnDefinition Width="*"></ColumnDefinition>
    <ColumnDefinition Width="*"> </ColumnDefinition>
</Grid.ColumnDefinitions>

Answer 2

Thank you for the reply.

I have tried the same with Width and Height set to "*" but still the result is not constant.

Sometime it setting the image in as expected and sometime not.

Answer 3

what are the expected values for_imageViewModelObj.Height/Width. Are they vary from 1 to 4/5 (no of rowDef/colDef) ?