Aetherix
Aetherix

Reputation: 2250

Images only showing in last ListBoxItem

This is what I'm building:

Listbox

On the right side of each ListBoxItem there should be 3 images, but as you can see they are only showing up on the last row. I'm using a ContentControl that refers to XAML shapes that I took from SyncFusion Metro Studio (exported as XAML).

Should I be using something else instead?

Here's my XAML:

<ListBox>
    <ListBox.ItemTemplate>
        <DataTemplate>
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition
                        Height="auto" />
                    <RowDefinition
                        Height="auto" />
                </Grid.RowDefinitions>
                <DockPanel
                    Grid.Row="0">
                    <TextBlock
                        DockPanel.Dock="Left"
                        Margin="0 0 6 0">
                        <TextBlock.Text>
                            <MultiBinding
                                StringFormat="{}{0:D2}:{1:D2}:">
                                <Binding
                                    Path="Task.Schedule.StartTime.Hours" />
                                <Binding
                                    Path="Task.Schedule.StartTime.Minutes" />
                            </MultiBinding>
                        </TextBlock.Text>
                    </TextBlock>
                    <ContentControl
                        Content="{StaticResource CM.Done}"
                        DockPanel.Dock="Right" />
                    <ContentControl
                        Content="{StaticResource CM.Comment}"
                        DockPanel.Dock="Right" />
                    <ContentControl
                        Content="{StaticResource CM.Important}"
                        DockPanel.Dock="Right" />
                    <TextBlock
                        Text="{Binding Task.Name}" />
                </DockPanel>

                <TextBlock
                    Grid.Row="1"
                    Foreground="Gray"
                    FontStyle="Italic"
                    Text="{Binding Status, UpdateSourceTrigger=PropertyChanged, Converter={StaticResource StatusEnumToStringConverter}}" />
            </Grid>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

Here's an example of what 1 image looks like:

<Viewbox
    x:Key="CM.Important">
    <Grid
        Width="24"
        Height="24"
        Visibility="Visible">
        <Path
            Data="M2.4915056,2.2260001C3.8691173,2.2260004,4.9830005,3.3431869,4.9830005,4.7181533L4.9830005,52.518807C4.9830005,53.897702 3.8691173,55.010998 2.4915056,55.010998 1.1132736,55.010998 0,53.897702 0,52.518807L0,4.7181533C0,3.3431869,1.1132736,2.2260004,2.4915056,2.2260001z M21.916903,2.1072685E-05C34.563281,-0.013741149 44.850898,6.7199533 60.671,0.96500372 60.671,11.992384 60.671,23.027636 60.671,34.061489 39.577531,41.738621 28.30889,27.205954 8.1920012,36.075898L8.1920012,2.9753833C13.223898,0.75891303,17.701443,0.0046082785,21.916903,2.1072685E-05z"
            Stretch="Uniform"
            Fill="#FFFF0000"
            Width="12"
            Height="12"
            Margin="0,0,0,0"
            RenderTransformOrigin="0.5,0.5">
            <Path.RenderTransform>
                <TransformGroup>
                    <TransformGroup.Children>
                        <RotateTransform
                            Angle="0" />
                        <ScaleTransform
                            ScaleX="1"
                            ScaleY="1" />
                    </TransformGroup.Children>
                </TransformGroup>
            </Path.RenderTransform>
        </Path>
    </Grid>
</Viewbox>

Upvotes: 0

Views: 337

Answers (2)

Damascus
Damascus

Reputation: 6651

This is normal behavior: you can't have twice the same UI object displayed in WPF. Here you are trying to display multiple instances of the same ViewBox

A common workaround is:

1 - Change your ViewBox Resources to Templates:

<ControlTemplate x:Key="CM.Important" TargetType="{x:Type Control}">
    <Viewbox>
        <!-- Your ViewBox content -->
    </Viewbox>
</ControlTemplate>

2- Change your ContentControls to Controls:

<Control Template="{StaticResource CM.Important}" />

Should work fine for you unless Path is adding some ambiguity

Upvotes: 4

Dirk
Dirk

Reputation: 10958

According to your comment, the static resource which you refer to with CM.* are ViewBoxes. A ViewBox is a control and a control can only have one parent. So only the last item has those images.

You should try to convert those resource to a different class which isn't a control. Unfortunately I haven't really worked with paths so I don't know which class would work best for them.

Upvotes: 1

Related Questions