CODEWITHSUNDEEP
c#wpfxamlscheduler
DueSouth
DueSouth

Reputation: 117

Custom schedule for one day XAML

I'm trying to create a custom schedule for only one day( a single column) where the elements of the schedule are binded to an ObservableCollection :

public ObservableCollection<Content> ContentsToTransfer { get; set; }

For now I'm having such code :

<Grid HorizontalAlignment="Stretch" Margin="430,52,444,0" x:Name="grid1" VerticalAlignment="Stretch" Width="Auto" OpacityMask="Black" Opacity="1" Background="#FFC2ECEC" ShowGridLines="False" >
            <Grid.Resources>
                <Style x:Key="VerticalSeparatorStyle" 
                    TargetType="{x:Type Separator}"
                    BasedOn="{StaticResource {x:Type Separator}}">
                    <Setter Property="Margin" Value="0,0,0,0"/>
                    <Setter Property="LayoutTransform">
                        <Setter.Value>
                            <TransformGroup>
                                <TransformGroup.Children>
                                    <TransformCollection>
                                        <RotateTransform Angle="90"/>
                                    </TransformCollection>
                                </TransformGroup.Children>
                            </TransformGroup>
                        </Setter.Value>
                    </Setter>
                </Style>
            </Grid.Resources>
            <Grid.RowDefinitions>
                <RowDefinition />
                <RowDefinition />
                <RowDefinition />
                <RowDefinition />
                <RowDefinition />
            </Grid.RowDefinitions>

            <Separator Grid.ColumnSpan="7" HorizontalAlignment="Stretch" Margin="0,132" x:Name="separator4" VerticalAlignment="Stretch" Width="Auto" Grid.Row="3" Grid.RowSpan="2" Background="Aqua" HorizontalContentAlignment="Stretch" Foreground="Aqua" OpacityMask="Aqua" />
            <Separator HorizontalAlignment="Stretch" Margin="0,132" x:Name="separator2" VerticalAlignment="Stretch" Width="Auto" Background="Aqua" Grid.ColumnSpan="7" Grid.Row="1" Grid.RowSpan="2" HorizontalContentAlignment="Stretch" Foreground="Aqua" />
            <Separator HorizontalAlignment="Stretch" x:Name="separator1" VerticalAlignment="Stretch" Background="Aqua" Grid.Row="2" Grid.ColumnSpan="7" Margin="0,129" Grid.RowSpan="2" HorizontalContentAlignment="Stretch" Foreground="Aqua" />
            <Separator HorizontalAlignment="Stretch" Margin="0,128" x:Name="separator3" VerticalAlignment="Stretch" Background="Aqua" Grid.ColumnSpan="7" Grid.RowSpan="2" Width="Auto" HorizontalContentAlignment="Stretch" Foreground="Aqua" />

            <Rectangle Height="Auto" HorizontalAlignment="Stretch" x:Name="rectangle1" Stroke="Aqua" VerticalAlignment="Stretch" Width="Auto" Grid.RowSpan="5" />

        </Grid>

The thing I want to do now is to bind the ObservableCollection to that grid so each time a content is added to the ObservableCollection it appears on the grid as well. I also want to add the behavior of a scheduler to it.

Can you help me out?

Am I doing it right?

Is there a best solution than doing that?

Upvotes: 0

Views: 280

Answers (1)

Mike Eason
Mike Eason

Reputation: 9713

It is not possible to bind a collection to a Grid, as the grid is not an ItemsControl. You can however, bind the collection to a ListBox, or a ListView, or a WrapPanel and so on. In this scenario, I'd recommend using an ItemsControl, where the ItemsPanel is a StackPanel, here's how:

<ItemsControl ItemsSource="{Binding ContentsToTransfer}">
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <StackPanel/>
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <!-- Your Template Here -->
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>

Inside your DataTemplate, you simply need to define what each Content will look like. For more information on DataTemplate, see the documentation

Upvotes: 1

Related Questions