maui icon indicating copy to clipboard operation
maui copied to clipboard

Basic UI is wrong on Windows

Open janseris opened this issue 2 years ago • 9 comments

Description

<Frame BorderColor="{DynamicResource Primary}" CornerRadius="5">

  • bottom part is not displayed

<Label FontSize="Small">...</Label>

  • font size is like 300% instead of Small

Windows: image

Android (any version): image

Steps to Reproduce

https://github.com/janseris/MAUI_SQLServer_Test/commit/52b2a18adfec97d28b0f4dbaca83b3b1938d37aa

Version with bug

6.0.400 (current)

Last version that worked well

Unknown/Other

Affected platforms

Windows

Affected platform versions

Windows 10

Did you find any workaround?

No response

Relevant log output

No response

janseris avatar Jun 30 '22 11:06 janseris

The other interesting thing is that neither of them break the labels into lines

NonameMissingNo avatar Jun 30 '22 15:06 NonameMissingNo

The other interesting thing is that neither of them break the labels into lines

Yes I was wondering about that, too. Also another thing is that AFAIK, stack layout doesn't have any property which would define the alignment of children (vertically and horizontally) inside the stack layout, every child must define it on their self which is a loooot of copy paste.

janseris avatar Jun 30 '22 20:06 janseris

verified repro on windows with above project.

kristinx0211 avatar Jul 05 '22 13:07 kristinx0211

The other interesting thing is that neither of them break the labels into lines

Are you using the LineBreakMode property?, happens on Windows?

jsuarezruiz avatar Jul 12 '22 07:07 jsuarezruiz

@jsuarezruiz Looking at their code, and it doesn't look like it. Although (bit off-topic), I think that the LineBreakMode should default to true, and you should opt out of it when you don't need it.

NonameMissingNo avatar Jul 12 '22 07:07 NonameMissingNo

The other interesting thing is that neither of them break the labels into lines

Are you using the LineBreakMode property?, happens on Windows?

Yes, label not breaking lines happens on windows. You can see it in the first screenshot - the long line text is Preview 5.2.something which is cut out.

janseris avatar Jul 12 '22 07:07 janseris

If the Frame is the main content of the page, works as is expected. But not the others. In Android works fine.

Screenshot 2022-09-05 030234

Any workaround? Guillermo

elGuille-info avatar Sep 05 '22 01:09 elGuille-info

The problem (in my code) is that the Frame is inside a VerticalLayout, using StackLayout works fine.

Screenshot 2022-09-05 032213

Hope this help. Guillermo

elGuille-info avatar Sep 05 '22 01:09 elGuille-info

Si sirve para algo, decir que en Xamarin para Android (en este caso, ni en Windows ni en iOS) también me ha ocurrido:

La solución en ese caso ha sido ponerle un margen el StackLayout que tiene el contenido del Frame.

<Frame x:Name="grbListView" Margin="4,0" Padding="3,0">

   <StackLayout>

frame_error

<Frame x:Name="grbListView" Margin="4,0" Padding="3,0">

   <StackLayout Margin="2">

Guillermo P.S. Perdón si no es el sitio correcto para comentarlo, aunque esto solo me ha ocurrido en una ocasión, y me resultó raro, ya que este fallo comentado en este "issue" es para Windows con .NET MAUI y nunca me había ocurrido con Xamarin.Forms.

elGuille-info avatar Oct 15 '22 13:10 elGuille-info

This seems ok to me now on 7.0.59 of MAUI:

image

There were previously some more issues with Frame and there have been fixes for that control in more recent updates, though I'd generally suggest using Border instead of Frame for a more consistent experience across platforms now.

In any case, this one looks resolved to me.

Redth avatar Feb 17 '23 14:02 Redth

This seems ok to me now on 7.0.59 of MAUI:

image

There were previously some more issues with Frame and there have been fixes for that control in more recent updates, though I'd generally suggest using Border instead of Frame for a more consistent experience across platforms now.

In any case, this one looks resolved to me.

Frame seems OK.

The font size small on Label does not seem to work here. From the original post:

<Label FontSize="Small">...</Label> font size is like 300% instead of Small

janseris avatar Feb 17 '23 15:02 janseris