Laden...

Image-Source bestimmen mit CheckBox

Erstellt von mctimotheus vor 13 Jahren Letzter Beitrag vor 13 Jahren 2.185 Views
M
mctimotheus Themenstarter:in
179 Beiträge seit 2008
vor 13 Jahren
Image-Source bestimmen mit CheckBox

Hallo,

ich habe folgenden XAML-Code:


<DockPanel LastChildFill="False">
    <CheckBox DockPanel.Dock="Right" VerticalAlignment="Center" />
    <Label DockPanel.Dock="Right" Content="In Planung" />
    <Image DockPanel.Dock="Right" Source="/Resources/Images/flag_yellow_16.png" Height="16" Width="16" />
</DockPanel>

Ich möchte nun, dass wenn die Checkbox angeklickt ist, das Bild ein anderes Bild anzeigt: /Resources/Images/flag_green_16.png.

Kann mir jemand ein wenig Starthilfe zur Lösung geben?

Wer nicht wagt .. der nicht gewinnt .. !

5.742 Beiträge seit 2007
vor 13 Jahren

Hallo mctimotheus,

das sollte sich mithilfe von Triggern erledigen lassen.

M
mctimotheus Themenstarter:in
179 Beiträge seit 2008
vor 13 Jahren

Auf Trigger bin ich auch noch gekommen. Leider weiß ich nicht welcher Trigger sich für dieses Problem am Besten eignet.

Ich würde mich mal noch als Anfänger bezeichnen und bin noch recht unerfahren in Umgang mit WPF. Würdet Ihr mir evtl. einen etwas detaillierteren Weg aufzeigen?

Wer nicht wagt .. der nicht gewinnt .. !

1.378 Beiträge seit 2006
vor 13 Jahren

DataTrigger ist hier das Werkzeug deiner Wahl.


        <CheckBox Name="cbx" DockPanel.Dock="Right" VerticalAlignment="Center" />

        <Image DockPanel.Dock="Right" Source="/Resources/Images/flag_yellow_16.png" Height="16" Width="16">
            <Image.Style>
                <Style>
                    <Style.Triggers>
                        <DataTrigger  Binding="{Binding ElementName=cbx, Path=IsChecked}" Value="True">
                            <Setter Property="Source" Value="/Resources/Images/flag_green_16.png"/>
                        </DataTrigger>
                    </Style.Triggers>
                </Style>
            </Image.Style>
        </Image>

Lg XXX

M
mctimotheus Themenstarter:in
179 Beiträge seit 2008
vor 13 Jahren

Danke erstmal für den Code. Ich habe diesen in meine Anwendung übertragen und bekomme folgende Exception:


Cannot resolve the Style Property 'Source'. Verify that the owning type is the Style's TargetType, or use Class.Property syntax to specify the Property.

Hier nochmal mein Code, nicht das ich was übersehen habe...


<CheckBox Name="cbxPlanning" DockPanel.Dock="Right" VerticalAlignment="Center" />
<Image DockPanel.Dock="Right" Source="/Resources/Images/flag_yellow_16.png" Height="16" Width="16">
    <Image.Style>
        <Style>
            <Style.Triggers>
                <DataTrigger Binding="{Binding ElementName=cbxPlanning, Path=IsChecked}" Value="True">
                    <Setter Property="Source" Value="/Resources/Images/flag_green_16.png"/>
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </Image.Style>
</Image>

Wer nicht wagt .. der nicht gewinnt .. !

3.430 Beiträge seit 2007
vor 13 Jahren

Hallo,

Setze bei der Definition vom Style das Start Tag so umzuändern
<Style TargetType="{x:Type Image}">

oder du versuchst mal beim Property="Source" folgedes hinzuschreiben Property="Image.Source"

Eines der beiden Möglichkeiten sollte das Problem lösen =)

Gruß
Michael

M
mctimotheus Themenstarter:in
179 Beiträge seit 2008
vor 13 Jahren

Guten Morgen,

Setze bei der Definition vom Style das Start Tag so umzuändern
<Style TargetType="{x:Type Image}">

oder du versuchst mal beim Property="Source" folgedes hinzuschreiben Property="Image.Source"

Habe beide Möglichkeiten ausprobiert. Die Exception verschwindet, das Bild wird aber leider nicht ausgetauscht beim Aktivieren der Checkbox. Es bleibt immer das flag_yellow_16.png-Image sichtbar.

Hat jemand hierzu evtl. noch eine Idee? Ich hab hin und her probiert, leider ohne Erfolg 🙁

Wer nicht wagt .. der nicht gewinnt .. !

1.378 Beiträge seit 2006
vor 13 Jahren

Ich habs gerade nochmal getestet und anscheinend kann man keine Properties per Style überschreiben, wenn sie direkt gesetzt wurden. Das heißt, das Standardimage muss per Style gesetzt werden dann sollte es funktionieren:

<CheckBox Name="cbxPlanning" DockPanel.Dock="Right" VerticalAlignment="Center" />
<Image DockPanel.Dock="Right" Height="16" Width="16">
    <Image.Style>
        <Style>
            <Setter Property="Source" Value="/Resources/Images/flag_yellow_16.png"/>
            <Style.Triggers>
                <DataTrigger Binding="{Binding ElementName=cbxPlanning, Path=IsChecked}" Value="True">
                    <Setter Property="Source" Value="/Resources/Images/flag_green_16.png"/>
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </Image.Style>
</Image>

Lg XXX

M
mctimotheus Themenstarter:in
179 Beiträge seit 2008
vor 13 Jahren

<CheckBox Name="cbxPlanning" DockPanel.Dock="Right" VerticalAlignment="Center" />
<Image DockPanel.Dock="Right" Height="16" Width="16">
    <Image.Style>
        <Style TargetType="{x:Type Image}">
            <Setter Property="Source" Value="/Resources/Images/flag_yellow_16.png"/>
            <Style.Triggers>
                <DataTrigger Binding="{Binding ElementName=cbxPlanning, Path=IsChecked}" Value="True">
                    <Setter Property="Source" Value="/Resources/Images/flag_green_16.png"/>
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </Image.Style>
</Image>

Eine Kleinigkeit hat noch gefehlt: Der TargetType im Style-Tag.

Nun funktioniert es. Vielen Dank euch allen !

Wer nicht wagt .. der nicht gewinnt .. !