WPF Button képpel

WPF Button képpel
2008-09-29T14:47:37+02:00
2008-10-01T09:36:52+02:00
2022-11-11T02:25:37+01:00
Lewisfm
Szaisztok!

Egy hozzáértő segítségét szeretném kérni. Ugyanis kéne nekem egy olyan gombot csinálni WPF alatt, mint a Delphi-ben a TBitBtn, azaz a szöveg mellett legyen egy kis kép is. Ez idáig még megy is. A probléma az, ha letiltom a gombot, a szövege megváltozik kiszürkítettre, de a kép nem. Na ezt kéne megoldanom, valamint még azt, ha a gomb fölé viszem az egérkurzot, akkor a képet egy haramdik állapotúre cserélje le, persze csak akkor, ha a gom engedléyezett.

Előre is köszi a segítséget, öteleket, hozzászólásokat, üdv:
Lewis
Mutasd a teljes hozzászólást!
Szóval ez nem is kicsit több is, mint amit szeretnék, ugyanis az elképzelésem szerint a kis kép 3 állapotát reprezentáló png képeket statikusan szeretném cserélgetni, tehát a source-t az állapotoktó függően erre:
normál állapot: Glyph/delete_16.png
letiltott állapot:Glyph/delete_16_d.png
mouseover állapot:Glyph/delete_16_h.png


Ez azt csinálja!

<src:ImageButton OriginalImage="Glyph/delete_16.png" DisabledImage="Glyph/delete_16_d.png" MouseOverImage="Glyph/delete_16_h.png"/>

Ennyi a kód.

Valamint az is érdekelne, hogy az <AccessText ...> hová kerül?


Mint a Button-nél, mert az ImageButton abból származik:

<src:ImageButton OriginalImage="Glyph/delete_16.png" DisabledImage="Glyph/delete_16_d.png" MouseOverImage="Glyph/delete_16_h.png"> <AccessText Margin="3,0,0,0" FontWeight="Bold" TextWrapping="WrapWithOverflow" Text="_Cancel" /> </src:ImageButton>
Mutasd a teljes hozzászólást!

  • Itt nézd meg ezt:
    Mark Boulter Owner - Posted on 2008.06.04. 1:35:01
    .
    Mutasd a teljes hozzászólást!
  • Ez már adott némi ötletet, de hiába próbálkoztam, nem sikerült megcsinálni.
    Nekem jelenleg így an meg egy gombom:

    <Button Name="btnCancel" Width="75" Height="24" Margin="8,8,0,6" Click="btnCancel_Click">
    <WrapPanel>
    <Image Name="img" Width="16" Height="16" VerticalAlignment="Center" Source="Glyph/delete_16.png" />
    <AccessText Margin="3,0,0,0" FontWeight="Bold" TextWrapping="WrapWithOverflow" Text="_Cancel" />
    </WrapPanel>
    </Button>

    Az img-nek kéne a képét megváltoztatni Glyph/delete_16_d.png-re, ha a Button le van tiltva. Az már csak a hab lenne a tortán, ha modnjuk egy btnCancel-t megvalósító ControlTemplate lenne hozzá létrehozva!

    Előre kösz a segítséget!
    Mutasd a teljes hozzászólást!
  • Ott van az, csak ki kell egészíteni:

    public class ImageButton : Button { public static readonly DependencyProperty MouseOverImageProperty; public static readonly DependencyProperty OriginalImageProperty; public static readonly DependencyProperty DisabledImageProperty; static ImageButton() { DefaultStyleKeyProperty.OverrideMetadata(typeof(ImageButton), new FrameworkPropertyMetadata(typeof(ImageButton))); MouseOverImageProperty = DependencyProperty.Register("MouseOverImage", typeof(ImageSource), typeof(ImageButton), new UIPropertyMetadata(null)); OriginalImageProperty = DependencyProperty.Register("OriginalImage", typeof(ImageSource), typeof(ImageButton), new UIPropertyMetadata(null)); DisabledImageProperty = DependencyProperty.Register("DisabledImage", typeof(ImageSource), typeof(ImageButton), new UIPropertyMetadata(null)); } public ImageSource MouseOverImage { get { return (ImageSource)GetValue(MouseOverImageProperty); } set { SetValue(MouseOverImageProperty, value); } } public ImageSource OriginalImage { get { return (ImageSource)GetValue(OriginalImageProperty); } set { SetValue(OriginalImageProperty, value); } } public ImageSource DisabledImage { get { return (ImageSource)GetValue(DisabledImageProperty); } set { SetValue(DisabledImageProperty, value); } } }

    generic.xaml:
    <Style TargetType="{x:Type local:ImageButton}"> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type local:ImageButton}"> <StackPanel Orientation="Horizontal"> <Image x:Name="Image1" Source="{TemplateBinding OriginalImage}"/> <ContentPresenter/> </StackPanel> <ControlTemplate.Triggers> <MultiTrigger> <MultiTrigger.Conditions> <Condition Property="IsMouseOver" Value="True"/> <Condition Property="IsEnabled" Value="True"/> </MultiTrigger.Conditions> <Setter TargetName="Image1" Property="Source" Value="{Binding Path=MouseOverImage, RelativeSource={RelativeSource TemplatedParent}}"/> </MultiTrigger> <Trigger Property="IsEnabled" Value="False"> <Setter TargetName="Image1" Property="Source" Value="{Binding Path=DisabledImage, RelativeSource={RelativeSource TemplatedParent}}"/> </Trigger> </ControlTemplate.Triggers> </ControlTemplate> </Setter.Value> </Setter> </Style>

    Valahogy így.
    Mutasd a teljes hozzászólást!
  • Bocs, hogy megint nyaggatlak, de nem boldogulok (még kezdő vagyok a területen).

    Szóval ez nem is kicsit több is, mint amit szeretnék, ugyanis az elképzelésem szerint a kis kép 3 állapotát reprezentáló png képeket statikusan szeretném cserélgetni, tehát a source-t az állapotoktó függően erre:
    normál állapot: Glyph/delete_16.png
    letiltott állapot:Glyph/delete_16_d.png
    mouseover állapot:Glyph/delete_16_h.png

    Valamint az is érdekelne, hogy az <AccessText ...> hová kerül?

    Az lenne jó, ha tiszta xaml lenne a megoldás. Akár azon az áron is, ha a mouseover eset nincs lekezelve.

    Nagyon köszönöm a segítséget chikk!

    Lewis
    Mutasd a teljes hozzászólást!
  • Szóval ez nem is kicsit több is, mint amit szeretnék, ugyanis az elképzelésem szerint a kis kép 3 állapotát reprezentáló png képeket statikusan szeretném cserélgetni, tehát a source-t az állapotoktó függően erre:
    normál állapot: Glyph/delete_16.png
    letiltott állapot:Glyph/delete_16_d.png
    mouseover állapot:Glyph/delete_16_h.png


    Ez azt csinálja!

    <src:ImageButton OriginalImage="Glyph/delete_16.png" DisabledImage="Glyph/delete_16_d.png" MouseOverImage="Glyph/delete_16_h.png"/>

    Ennyi a kód.

    Valamint az is érdekelne, hogy az <AccessText ...> hová kerül?


    Mint a Button-nél, mert az ImageButton abból származik:

    <src:ImageButton OriginalImage="Glyph/delete_16.png" DisabledImage="Glyph/delete_16_d.png" MouseOverImage="Glyph/delete_16_h.png"> <AccessText Margin="3,0,0,0" FontWeight="Bold" TextWrapping="WrapWithOverflow" Text="_Cancel" /> </src:ImageButton>
    Mutasd a teljes hozzászólást!
  • Most már értem!!!

    Ezer köszönet és hála! Még ma ki is fogom próbálni!
    Mutasd a teljes hozzászólást!
Tetszett amit olvastál? Szeretnél a jövőben is értesülni a hasonló érdekességekről?
abcd