Zum Inhalt springen

[WPF Xaml] Diverse Items in Button vereinen


Nightfall

Empfohlene Beiträge

Hallo Leute!

Was ich vorweg sagen muss: Ich wusste nicht genau wo ich mit meiner WPF bzw. Xaml Frage richtig bin. Wenn ich hier falsch bin dann entschuldigt das bitte und verschiebt meinen Thread einfach. :)

Also zu meiner Frage: Ich möchte einen Button machen der andere Items beinhaltet. Also hier habe ich mal ein Beispiel wie es aussehen soll:


<Grid>

       <Button HorizontalAlignment="Left" VerticalAlignment="Top" Background="White" Width="99.359" Height="42.736" Margin="113.043,68,0,0" />

       <Label Background="Red" Margin="120.733,74.891,0,0" Height="29.014" VerticalAlignment="Top" Width="84.59" Opacity="0.5" HorizontalAlignment="Left" RenderTransformOrigin="0.5,0.5" HorizontalContentAlignment="Center" VerticalContentAlignment="Center" Name="Hintergrund"/>

       <Label Content="Press" Foreground="Black" Margin="120.733,74.891,0,0" Height="29.014" VerticalAlignment="Top" Width="84.59" HorizontalAlignment="Left" RenderTransformOrigin="0.5,0.5" HorizontalContentAlignment="Center" VerticalContentAlignment="Center" Name="Button_Text"/>

       <Ellipse HorizontalAlignment="Left" Margin="120.733,74.891,0,0" VerticalAlignment="Top" Width="84.59" Height="13.228" Fill="Yellow" Stroke="White" Opacity="0.6"/>

       <Ellipse HorizontalAlignment="Left" Margin="120.733,93.818,0,0" VerticalAlignment="Top" Width="84.59" Height="11.073" Fill="Blue" Stroke="Gray" Opacity="0.5"/>

</Grid>

Als Anhang habe ich auch nochmal ein Bild angehängt. Auf dem Bild sieht man den Button auf einem Schwarzen Hintergrund.

Die Farben des Buttons sind wirkürlich gewählt. :P

Also was ich haben möchte: Einen Button der so aussieht und dem ich auch Events wie "MouseOver" vernünftig geben kann. Derzeit ist es so das ein Event wie "MouseOver" kaum ausgelöst wird da die Maus über einem Label oder einer Ellipse ist aber nicht direkt über dem Button.

Hat jemand eine Idee wie ich die ganzen Items zu dem Button "hinzufüge"?

Vielen Dank schon einmal!

Gruß!

p.s. falls noch fragen sind: immer her damit. ;)

post-44944-14430448410233_thumb.jpg

Link zu diesem Kommentar
Auf anderen Seiten teilen

Warum lässt du dann den Content vom Button leer?! :rolleyes:

Steht in dem nicht nur der Text der auf dem Button drauf stehen soll? :confused:

Wenn ja: Den schreibe ich später per Label extra drauf um die Schrift als obersten Layer zu haben.

Habe die Lösung eben selbst gefunden.

Für alle die das gleiche Problem haben ist hier meine Lösung:


<Button HorizontalAlignment="Left" VerticalAlignment="Top" Foreground="WhiteSmoke" Width="100" Height="43" Margin="113.043,68,0,0" BorderBrush="#FF003C74">            

            <Button.Template>

                <ControlTemplate>

                    <Canvas>

                        <Label Background="Black" Height="43" VerticalAlignment="Top" Width="100" HorizontalAlignment="Left" RenderTransformOrigin="0.5,0.5" HorizontalContentAlignment="Center" VerticalContentAlignment="Center" Name="ButtonBackground"/>

                        <Label Background="Red" Height="33" VerticalAlignment="Top" Margin="5,5,0,0" Width="90" Opacity="0.5" HorizontalAlignment="Left" RenderTransformOrigin="0.5,0.5" HorizontalContentAlignment="Center" VerticalContentAlignment="Center" Name="Hintergrund"/>

                        <Ellipse HorizontalAlignment="Left" VerticalAlignment="Top" Margin="5,5,0,0" Width="90" Height="17" Fill="LightBlue" Stroke="LightBlue" Opacity="0.6"/>

                        <Ellipse HorizontalAlignment="Left" VerticalAlignment="Top" Margin="5,28,0,0" Width="90" Height="11" Fill="LimeGreen" Stroke="LimeGreen" Opacity="0.5"/>

                        <Label Content="Press" Foreground="White" Height="43" VerticalAlignment="Top" Width="100" HorizontalAlignment="Left" RenderTransformOrigin="0.5,0.5" HorizontalContentAlignment="Center" VerticalContentAlignment="Center" Name="Button_Text"/>

                    </Canvas>

                </ControlTemplate>

            </Button.Template>            

        </Button>

Ich bin offen für jeden Vorschlag der verbesserung. :)

Gruß

Link zu diesem Kommentar
Auf anderen Seiten teilen

Steht in dem nicht nur der Text der auf dem Button drauf stehen soll?

Nein, du kannst beliebig viel Kapseln.

Du kannst auch einen Button in einen Button machen, das ist ja das schöne an WPF.

Der Content ist nur meist auf ein Element beschränkt.


    <Button HorizontalAlignment="Left" VerticalAlignment="Top" Foreground="WhiteSmoke" Width="100" Height="43" Margin="113.043,68,0,0" BorderBrush="#FF003C74">

        <Canvas>

            <Label Background="Black" Height="43" VerticalAlignment="Top" Width="100" HorizontalAlignment="Left" RenderTransformOrigin="0.5,0.5" HorizontalContentAlignment="Center" VerticalContentAlignment="Center" Name="ButtonBackground"/>

            <Label Background="Red" Height="33" VerticalAlignment="Top" Margin="5,5,0,0" Width="90" Opacity="0.5" HorizontalAlignment="Left" RenderTransformOrigin="0.5,0.5" HorizontalContentAlignment="Center" VerticalContentAlignment="Center" Name="Hintergrund"/>

            <Ellipse HorizontalAlignment="Left" VerticalAlignment="Top" Margin="5,5,0,0" Width="90" Height="17" Fill="LightBlue" Stroke="LightBlue" Opacity="0.6"/>

            <Ellipse HorizontalAlignment="Left" VerticalAlignment="Top" Margin="5,28,0,0" Width="90" Height="11" Fill="LimeGreen" Stroke="LimeGreen" Opacity="0.5"/>

            <Label Content="Press" Foreground="White" Height="43" VerticalAlignment="Top" Width="100" HorizontalAlignment="Left" RenderTransformOrigin="0.5,0.5" HorizontalContentAlignment="Center" VerticalContentAlignment="Center" Name="Button_Text"/>

        </Canvas>

    </Button>

Musst das natürlich noch mit den Zahlen anpassen. (Bei mir sieht das verrutscht aus.)

Link zu diesem Kommentar
Auf anderen Seiten teilen

Nein, du kannst beliebig viel Kapseln.

Du kannst auch einen Button in einen Button machen, das ist ja das schöne an WPF.

Der Content ist nur meist auf ein Element beschränkt.

Ok :)

Ich bin nen WPF Anfänger aber langsam wirds.

Musst das natürlich noch mit den Zahlen anpassen. (Bei mir sieht das verrutscht aus.)

bei mir passt des :P:D

So Problem gelöst.

Nu muss ich nur noch die Farben bei einem "MouseOver" bzw. "MouseDown" Event ändern. Aber das werd ich schon irgendwie hin kriegen. :)

Danke und Gruß

Link zu diesem Kommentar
Auf anderen Seiten teilen

Dein Kommentar

Du kannst jetzt schreiben und Dich später registrieren. Wenn Du ein Konto hast, melde Dich jetzt an, um unter Deinem Benutzernamen zu schreiben.

Gast
Auf dieses Thema antworten...

×   Du hast formatierten Text eingefügt.   Formatierung wiederherstellen

  Nur 75 Emojis sind erlaubt.

×   Dein Link wurde automatisch eingebettet.   Einbetten rückgängig machen und als Link darstellen

×   Dein vorheriger Inhalt wurde wiederhergestellt.   Editor leeren

×   Du kannst Bilder nicht direkt einfügen. Lade Bilder hoch oder lade sie von einer URL.

Fachinformatiker.de, 2024 by SE Internet Services

fidelogo_small.png

Schicke uns eine Nachricht!

Fachinformatiker.de ist die größte IT-Community
rund um Ausbildung, Job, Weiterbildung für IT-Fachkräfte.

Fachinformatiker.de App

Download on the App Store
Get it on Google Play

Kontakt

Hier werben?
Oder sende eine E-Mail an

Social media u. feeds

Jobboard für Fachinformatiker und IT-Fachkräfte

×
×
  • Neu erstellen...