vb@rchiv
VB Classic
VB.NET
ADO.NET
VBA
C#
NEU! sevCoolbar 3.0 - Professionelle Toolbars im modernen Design!  
 vb@rchiv Quick-Search: Suche startenErweiterte Suche starten   RSS-Feeds  | Newsletter  | Impressum  | Datenschutz  | vb@rchiv CD Vol.6  | Shop Copyright ©2000-2018
 
zurück
Rubrik: Controls   |   VB-Versionen: VB200806.05.10
WPF Button, dessen Inhalt sich stufenlos an eine Grössenänderung anpasst

Der Tipp beschreibt die Grundlagen, um einen Button mit stufenlos skalierbarem Inhalt zu erstellen. Der Code kann in ein UserControl aufgenommen werden.

Autor:   Thomas VinkmannBewertung:     [ Jetzt bewerten ]Views:  8.730 
ohne HomepageSystem:  Win2k, WinXP, Vista, Win7, Win8, Win10 Beispielprojekt auf CD 

WPF bietet die Möglichkeit der Skalierung. Die kann man nutzen um den Inhalt eines Steuerelemnts stufenlos an eine Größenänderung anzupassen. Die dabei auftretenden Verzerrungen werden in Kauf genommen.

Die XAML Datei enthält folgende Beschreibung:

<Window x:Class="Window1"
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation;
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml;
  Title="Window1" Height="300" Width="300">
  <Grid>

    <!--
      Ein Canvas als Container für den Button 
      Mit Margin wird das Canvas im Fenster positioniert 
      ACHTUNG: Es dürfen KEINE festen Gößensangaben 
      verwendet werden da sich die Größe nicht anpasst
    -->
    <Canvas Name="Container_1" SizeChanged="Container_1_SizeChanged" 
      Margin="150,200,10,10" >

      <!--
        In den Container wird ein Button eingefügt
        Mit Margin wird der Button im Canvas positioniert 
        ACHTUNG: Es dürfen KEINE festen Gößensangaben 
        verwendet werden da sich die Größe nicht anpasst
      -->
      <Button Name="SkalierbarerButton_1" Content="SkalierbarerButton" 
        Margin="1,1,1,1" VerticalAlignment="Stretch" 
        HorizontalAlignment="Stretch"/>

    </Canvas>

  </Grid>
</Window>

Alles weitere wird im "CodeBehind" verarbeitet:

1. Schritt Variablen und Objekte

  • Variablen für Höhe/Breite des Canvas
  • Variablen für Höhe/Breite des Button
  • Variablen für das Verhälnis der Canvas Breite/Höhe zu Button Breite/Höhe
  • Transformierung vom Typ ScaleTransform

Class Window1 
 
#Region " Variablen "
 
  ''' <summary>
  ''' Variable für Container Breite
  ''' </summary>
  ''' <remarks>Nimmt die aktuelle Breite des Canvas auf</remarks>
  Private ContainerBreite As Double
 
  ''' <summary>
  ''' Variable für Container Hoehe
  ''' </summary>
  ''' <remarks>Nimmt die aktuelle Höhe des Canvas auf</remarks>
  Private ContainerHoehe As Double
 
  ''' <summary>
  ''' Variable für Button Breite
  ''' </summary>
  ''' <remarks>Nimmt die aktuelle Breite des Buttons auf</remarks>
  Private ButtonBreite As Double
 
  ''' <summary>
  ''' Variable für Button Höhe
  ''' </summary>
  ''' <remarks>Nimmt die aktuelle Höhe des Buttons auf</remarks>
  Private ButtonHoehe As Double
 
  ''' <summary>
  ''' Variable für Verhältnis in X-Richtung
  ''' </summary>
  ''' <remarks>Das Verhälnis aus Canvas Breite zu Button Breite</remarks>
  Private Skalierung_X As Double
 
  ''' <summary>
  ''' Variable für Verhältnis in Y-Richtung
  ''' </summary>
  ''' <remarks>Das Verhälnis aus Canvas Höhe zu Button Höhe</remarks>
  Private Skalierung_Y As Double
 
  ''' <summary>
  ''' Transformation Object 
  ''' </summary>
  ''' <remarks>Hat den Typ ScaleTransform</remarks>
  Private MyScaleTransform As ScaleTransform
 
#End Region
 
...
...
...

2. Reaktion auf die Größenänderung des Canvas und Berechnung der Skalierung
Für ScaleTransform werden nur die Parameter

  • ScaleX
  • ScaleY
benutzt.

#Region " Methoden "
 
  ''' <summary>
  ''' EVENT: Wird bei Grössenänderung des Containers ausgelöst
  ''' </summary>
  ''' <remarks>Berechnet die Skalierung des Buttons</remarks>
  Private Sub Container_1_SizeChanged(ByVal sender As System.Object, _
    ByVal e As System.Windows.SizeChangedEventArgs)
 
    ' Aktuelle Container Breite
    ContainerBreite = Me.Container_1.ActualWidth
    ' Aktuelle Container Hoehe
    ContainerHoehe = Me.Container_1.ActualHeight
    ' Aktuelle Button Breite
    ButtonBreite = Me.SkalierbarerButton_1.ActualWidth
    ' Aktuelle Button Hoehe
    ButtonHoehe = Me.SkalierbarerButton_1.ActualHeight
    ' Verhälnis in X-Richtung berechnen
    Skalierung_X = ContainerBreite / ButtonBreite
    ' Verhälnis in Y-Richtung berechnen
    Skalierung_Y = ContainerHoehe / ButtonHoehe
    ' Transformation vom Typ ScaleTransform erstellen
    MyScaleTransform = New ScaleTransform(Skalierung_X, Skalierung_Y)
    ' Dem Button das neue Layout zuweisen
    Me.SkalierbarerButton_1.LayoutTransform = MyScaleTransform
  End Sub
 
#End Region
 
End Class

Dieser Code diente als Grundlage für ein UserControl Button, der eine Grafik und einen Text enthielt. Der komplette Inhalt sollte stufenlos skalierbar sein.

Dieser Tipp wurde bereits 8.730 mal aufgerufen.

Voriger Tipp   |   Zufälliger Tipp   |   Nächster Tipp

Über diesen Tipp im Forum diskutieren
Haben Sie Fragen oder Anregungen zu diesem Tipp, können Sie gerne mit anderen darüber in unserem Forum diskutieren.

Neue Diskussion eröffnen

nach obenzurück


Anzeige

Kauftipp Unser Dauerbrenner!Diesen und auch alle anderen Tipps & Tricks finden Sie auch auf unserer aktuellen vb@rchiv  Vol.6
(einschl. Beispielprojekt!)

Ein absolutes Muss - Geballtes Wissen aus mehr als 8 Jahren vb@rchiv!
- nahezu alle Tipps & Tricks und Workshops mit Beispielprojekten
- Symbol-Galerie mit mehr als 3.200 Icons im modernen Look
Weitere Infos - 4 Entwickler-Vollversionen (u.a. sevFTP für .NET), Online-Update-Funktion u.v.m.
 
   

Druckansicht Druckansicht Copyright ©2000-2018 vb@rchiv Dieter Otter
Alle Rechte vorbehalten.
Microsoft, Windows und Visual Basic sind entweder eingetragene Marken oder Marken der Microsoft Corporation in den USA und/oder anderen Ländern. Weitere auf dieser Homepage aufgeführten Produkt- und Firmennamen können geschützte Marken ihrer jeweiligen Inhaber sein.

Diese Seiten wurden optimiert für eine Bildschirmauflösung von mind. 1280x1024 Pixel