none
zwei labels hintereinander ausrichten RRS feed

  • Frage

  • Hallo,

    ich habe eine Zeitanzeige, welche ich jede sekunde über einen Timer aktualisiere. Dabei besteht die eigentliche Anzeige aus 2 Label Objekten. Dem einen weise ich Stunde:Minute zu und dem anderen dann die Sekunden.

    Das ganze ist deshalb zweigeteilt, da die Stunden/Minuten sehr groß und die Sekunden dann klein dahinter erscheinen...

    Das Std/Min Label habe ich dann zentriert in meiner Form ausgegeben...

    Nun ist die Frage / das Problem - wie bekomme ich die Sekunden dahinter, so das die immer im gleichen Abstand zum vorherigen Label-Text sind, egal wie lang dieser ist (z.B. 23:00 ist halt breiter als 1:11...)

    Vielen Dank für Euer Feedback

    Liebe Grüße

    Martin

    Mittwoch, 19. Oktober 2016 08:00

Antworten

  • Hallo Martin,

    wegen "Form" gehe ich mal von Windows Forms aus.

    Generell könnte man die Labels in ein FlowLayoutPanel packen, das auf AutoSize und GrowAndShrink gestellt ist, aber das wäre doch fummelig.

    Besser wäre hier ein einfaches Panel zu nehmen und das Ganze selbst zu zeichnen. Auf die Schnell zusammengetippt (und nicht perfekt):

            private void SekundenTimer_Tick(object sender, EventArgs e)
            {
                // Neu zeichnen anstoßen
                ZeitPanel.Invalidate();
            }
    
    #if DEBUG
            int dateValuesIndex = 0;
            DateTime[] dateValues = new DateTime[]
            {
                new DateTime(2016,  1,  1,  1,  1,  1, 1),
                new DateTime(2016, 12, 31, 23, 59, 59, 999),
                new DateTime(2016, 10, 12, 11, 11, 11, 111),
                new DateTime(2016,  1,  1,  2,  0,  0, 0),
                new DateTime(2016, 12, 31, 12,  9,  1),
                new DateTime(2016,  9,  1, 20, 19, 11),
                new DateTime(2016,  8, 31,  2, 29, 23),
                new DateTime(2016,  7, 15, 21, 39, 35),
                new DateTime(2016,  6, 30,  3, 49, 47),
                new DateTime(2016, 10,  1, 23, 59, 59)
            };
    #endif
            private void ZeitPanel_Paint(object sender, PaintEventArgs e)
            {
                Panel panel = (Panel)sender;
    
                // Hintergrund
                using (var fillBrush = new SolidBrush(Color.AliceBlue))
                    e.Graphics.FillRectangle(fillBrush, panel.ClientRectangle);
    
                DateTime now = DateTime.Now;
    #if DEBUG
                dateValuesIndex++;
                if (dateValuesIndex >= dateValues.Length)
                    dateValuesIndex = 0;
                now = dateValues[dateValuesIndex];
    #endif
    
                Font stundeMinuteFont = new Font("Tahoma", 16.0f);
                string stundeMinuteText = String.Format($"{now:H:m}");
                Size stundeMinuteSize = TextRenderer.MeasureText(stundeMinuteText, stundeMinuteFont);
    
                string sekundeText = String.Format($"{now:s.FFF}");
                Font sekundeFont = new Font("Tahoma", 12.0f);
                Size sekundeSize = TextRenderer.MeasureText(sekundeText, sekundeFont);
    
                Point sekundeMinutePoint = new Point(12, 12);
                TextRenderer.DrawText(e.Graphics, stundeMinuteText, stundeMinuteFont, sekundeMinutePoint, Color.Blue);
    
                Point sekundePoint = new Point(
                    sekundeMinutePoint.X + stundeMinuteSize.Width, 
                    sekundeMinutePoint.Y + (stundeMinuteSize.Height - sekundeSize.Height) / 2 );
                TextRenderer.DrawText(e.Graphics, sekundeText, sekundeFont, sekundePoint, Color.Green);
    
                stundeMinuteFont.Dispose();
                sekundeFont.Dispose();
            }
    

    Wenn gewünscht, kann man weitere Verschönerungen einbauen. Über DEBUG - ggf. eine spezielle Konstante definieren - wird die Zeit aus einem Test-Array ausgewählt, damit man nicht solange auf Änderungen warten muss.

    Gruß Elmar

    • Als Antwort markiert Martin FFB Mittwoch, 19. Oktober 2016 10:35
    Mittwoch, 19. Oktober 2016 09:28
    Beantworter

Alle Antworten

  • Hallo Martin,

    falls ich die Frage richtig verstehe: Feste breite für die Labels und von rechts-nach-links schreiben.

    Gruß


    - Florian

    Mittwoch, 19. Oktober 2016 08:32
  • Hallo,

    so könnte es gehen

    <StackPanel Orientation="Horizontal" HorizontalAlignment="Left">
                <Label x:Name="labStunden" Content="23" HorizontalAlignment="Left" Padding="0" />
                <Label x:Name="labMinuten" Content="23" Padding="0" Margin="3,0,0,0" />
            </StackPanel>

    Dann halt nur noch mit Margin arbeiten

    Gruß

    Thomas


    Icon für UWP: https://www.microsoft.com/store/apps/9nblggh5fzpm

    • Als Antwort vorgeschlagen Konrad Neitzel Mittwoch, 19. Oktober 2016 09:22
    Mittwoch, 19. Oktober 2016 09:00
  • Hi Martin,

    was mir noch einfällt: Wieso zwei Label? Wenn es doch hintereinander sein soll, dann könnte es doch auch ein Label sein und der Inhalt setzt sich dann halt aus zwei Werten zusammen. 

    Mit den besten Grüßen,

    Konrad

    Mittwoch, 19. Oktober 2016 09:23
  • Hallo Martin,

    wegen "Form" gehe ich mal von Windows Forms aus.

    Generell könnte man die Labels in ein FlowLayoutPanel packen, das auf AutoSize und GrowAndShrink gestellt ist, aber das wäre doch fummelig.

    Besser wäre hier ein einfaches Panel zu nehmen und das Ganze selbst zu zeichnen. Auf die Schnell zusammengetippt (und nicht perfekt):

            private void SekundenTimer_Tick(object sender, EventArgs e)
            {
                // Neu zeichnen anstoßen
                ZeitPanel.Invalidate();
            }
    
    #if DEBUG
            int dateValuesIndex = 0;
            DateTime[] dateValues = new DateTime[]
            {
                new DateTime(2016,  1,  1,  1,  1,  1, 1),
                new DateTime(2016, 12, 31, 23, 59, 59, 999),
                new DateTime(2016, 10, 12, 11, 11, 11, 111),
                new DateTime(2016,  1,  1,  2,  0,  0, 0),
                new DateTime(2016, 12, 31, 12,  9,  1),
                new DateTime(2016,  9,  1, 20, 19, 11),
                new DateTime(2016,  8, 31,  2, 29, 23),
                new DateTime(2016,  7, 15, 21, 39, 35),
                new DateTime(2016,  6, 30,  3, 49, 47),
                new DateTime(2016, 10,  1, 23, 59, 59)
            };
    #endif
            private void ZeitPanel_Paint(object sender, PaintEventArgs e)
            {
                Panel panel = (Panel)sender;
    
                // Hintergrund
                using (var fillBrush = new SolidBrush(Color.AliceBlue))
                    e.Graphics.FillRectangle(fillBrush, panel.ClientRectangle);
    
                DateTime now = DateTime.Now;
    #if DEBUG
                dateValuesIndex++;
                if (dateValuesIndex >= dateValues.Length)
                    dateValuesIndex = 0;
                now = dateValues[dateValuesIndex];
    #endif
    
                Font stundeMinuteFont = new Font("Tahoma", 16.0f);
                string stundeMinuteText = String.Format($"{now:H:m}");
                Size stundeMinuteSize = TextRenderer.MeasureText(stundeMinuteText, stundeMinuteFont);
    
                string sekundeText = String.Format($"{now:s.FFF}");
                Font sekundeFont = new Font("Tahoma", 12.0f);
                Size sekundeSize = TextRenderer.MeasureText(sekundeText, sekundeFont);
    
                Point sekundeMinutePoint = new Point(12, 12);
                TextRenderer.DrawText(e.Graphics, stundeMinuteText, stundeMinuteFont, sekundeMinutePoint, Color.Blue);
    
                Point sekundePoint = new Point(
                    sekundeMinutePoint.X + stundeMinuteSize.Width, 
                    sekundeMinutePoint.Y + (stundeMinuteSize.Height - sekundeSize.Height) / 2 );
                TextRenderer.DrawText(e.Graphics, sekundeText, sekundeFont, sekundePoint, Color.Green);
    
                stundeMinuteFont.Dispose();
                sekundeFont.Dispose();
            }
    

    Wenn gewünscht, kann man weitere Verschönerungen einbauen. Über DEBUG - ggf. eine spezielle Konstante definieren - wird die Zeit aus einem Test-Array ausgewählt, damit man nicht solange auf Änderungen warten muss.

    Gruß Elmar

    • Als Antwort markiert Martin FFB Mittwoch, 19. Oktober 2016 10:35
    Mittwoch, 19. Oktober 2016 09:28
    Beantworter
  • Hallo Konrad,

    danke für Deine Antwort. Die zwei Labels brauche ich, weil ich die unterschiedlich formatiere (Schriftgröße)

    Liebe Grüße

    Martin

    Mittwoch, 19. Oktober 2016 10:32
  • Hallo Elmar,

    das sieht gut aus... muss ich mal versuchen - werd danach nochmal Feedback geben.

    Danke schonmal

    Liebe Grüße

    Martin

    Mittwoch, 19. Oktober 2016 10:33
  • Hallo Thomas,

    danke. Aber ich arbeite (noch) mit Forms - das ist glaube ich MFC odeR?

    Liebe Grüße

    Martin

    Mittwoch, 19. Oktober 2016 10:34
  • Hallo Florian,

    die Labels sollen dann dynamisch sein. das erste Label ist ha so breit, wie die aktuelle Zeit und das andere soll dann entsprechend dahinter kommen (Windows Forms)

    Liebe Grüße

    Martin

    Mittwoch, 19. Oktober 2016 10:35