gui-cs / Terminal.Gui

Cross Platform Terminal UI toolkit for .NET
MIT License
9.32k stars 673 forks source link

In the v2 version, using Chinese will cause UI confusion. #2928

Open int2e opened 8 months ago

int2e commented 8 months ago

Describe the bug In the v2 version, using Chinese will cause UI confusion, the same code runs well in the v1 version.

Screenshots v1:

OK

v2:

ERR

Desktop (please complete the following information):

code

static void Main()
{
    Application.Init();
    var top = Application.Top;
    top.Closing += (sender, e) =>
    {
        var result = MessageBox.Query("Confirm", 
            "Are you sure you want to quit ui?",  0,
            "Yes", "No");
        if (result != 0)
        {
            e.Cancel = true;
        }

    };

    var win = new Window()
    {
        Title = "Test",
        X = 0,
        Y = 0,
        Width = Dim.Fill(),
        Height = Dim.Fill(),
    };
    top.Add(win);

    var buttonPanel = new FrameView()
    {
        Title = "Command",
        X = 0,
        Y = 1,
        Width = Dim.Fill(),
        Height = 5,
    };
    win.Add(buttonPanel);

    buttonPanel.Add(
        new Button(1, 1, "你"), // v1: A
        new Button(12, 1, "好"), // v1: B
        new Button(22, 1, "呀")// v1: C

    );

    Application.Run();
}
BDisp commented 8 months ago

Try the current develop and v2_develop branches. The nuget packages aren't updated yet. v1: image

v2: image

int2e commented 8 months ago

v2_develop problem remains. Don't know what went wrong.

BDisp commented 8 months ago

Did you did a pull from upstream? Maybe you haven't it updated yet. Which terminal do you are using?

int2e commented 8 months ago

Did you did a pull from upstream? Maybe you haven't it updated yet. Which terminal do you are using?

I just cloned the code, v2_develop problem remains.

Windows Terminal 1.18.2822.0

BDisp commented 8 months ago

Windows Terminal 1.18.2822.0

Mine too. Which font do you are using? Mine is MeslolGM Nerd Font.

int2e commented 8 months ago

I tried using MesloLGMNerdFont-Regular.ttf and also tried other fonts, but the problem remains.

int2e commented 8 months ago

I tried using MesloLGMNerdFont-Regular.ttf and also tried other fonts, but the problem remains.

v1Still working very well.

BDisp commented 8 months ago

What configuration do you have on the default terminal app at Initialization on the Windows Terminal?

int2e commented 8 months ago

What configuration do you have on the default terminal app at Initialization on the Windows Terminal?

default configuration!

Completely clueless.

BDisp commented 8 months ago

default configuration!

I think you mean that is configured as "Let Windows decide".

Completely clueless.

No, if you use the configuration "Host Windows Console" the output is completely different.

With "Let Windows decide" or "Windows Terminal": image

With "Host Windows Console": image

@tig see that the "Yes" and "No" buttons aren't output well. This is really a bug in this case.

@tig see the second image where the scroll bar is showing and spoiling the output. This is related with the fact that is needed to distinguish between _isWindowsTerminal for using true color and using alternate buffer when debugging on VS2022. Alternate buffer is only supported on Windows if it's using Windows Terminal. Thus the "WT_SESSION": "yes" on the lauchSettings.json isn't suffice.

If I set "WT_SESSION": "" with "Host Windows Console" the scroll bar isn't show: image

int2e commented 8 months ago

What configuration do you have on the default terminal app at Initialization on the Windows Terminal?

settings.json

{
    "$help": "https://aka.ms/terminal-documentation",
    "$schema": "https://aka.ms/terminal-profiles-schema",
    "actions": 
    [
        {
            "command": 
            {
                "action": "copy",
                "singleLine": false
            },
            "keys": "ctrl+c"
        },
        {
            "command": "paste",
            "keys": "ctrl+v"
        },
        {
            "command": "find",
            "keys": "ctrl+shift+f"
        },
        {
            "command": 
            {
                "action": "splitPane",
                "split": "auto",
                "splitMode": "duplicate"
            },
            "keys": "alt+shift+d"
        }
    ],
    "copyFormatting": "none",
    "copyOnSelect": false,
    "defaultProfile": "{574e775e-4f2a-5b96-ac1e-a2962a402336}",
    "newTabMenu": 
    [
        {
            "type": "remainingProfiles"
        }
    ],
    "profiles": 
    {
        "defaults": 
        {
            "colorScheme": "Campbell",
            "font": 
            {
                "face": "Cascadia Mono",
                "size": 12.0
            },
            "useAtlasEngine": false
        },
        "list": 
        [
            {
                "commandline": "%SystemRoot%\\System32\\WindowsPowerShell\\v1.0\\powershell.exe",
                "guid": "{61c54bbd-c2c6-5271-96e7-009a87ff44bf}",
                "hidden": false,
                "name": "Windows PowerShell"
            },
            {
                "commandline": "%SystemRoot%\\System32\\cmd.exe",
                "font": 
                {
                    "face": "Cascadia Mono"
                },
                "guid": "{0caa0dad-35be-5f56-a8ff-afceeeaa6101}",
                "hidden": false,
                "name": "\u547d\u4ee4\u63d0\u793a\u7b26"
            },
            {
                "guid": "{b453ae62-4e3d-5e58-b989-0a998ec441b8}",
                "hidden": false,
                "name": "Azure Cloud Shell",
                "source": "Windows.Terminal.Azure"
            },
            {
                "guid": "{33bab515-934e-56b4-96da-1c46242b6bb4}",
                "hidden": false,
                "name": "Developer Command Prompt for VS 2019",
                "source": "Windows.Terminal.VisualStudio"
            },
            {
                "guid": "{948fa2a8-1444-594b-9979-f920a446ec4e}",
                "hidden": false,
                "name": "Developer PowerShell for VS 2019",
                "source": "Windows.Terminal.VisualStudio"
            },
            {
                "guid": "{1d9e9aa4-4c7a-552e-b77d-3a966c58e16b}",
                "hidden": false,
                "name": "Developer Command Prompt for VS 2022",
                "source": "Windows.Terminal.VisualStudio"
            },
            {
                "guid": "{868a137b-eeb6-50e3-aa72-1b85b5d692ff}",
                "hidden": false,
                "name": "Developer PowerShell for VS 2022",
                "source": "Windows.Terminal.VisualStudio"
            },
            {
                "guid": "{2ef14272-7a46-5fd2-8fd7-8b83d08411d1}",
                "hidden": false,
                "name": "Developer Command Prompt for VS 2022 [Preview]",
                "source": "Windows.Terminal.VisualStudio"
            },
            {
                "guid": "{ba6d5c20-1f1a-58a3-a1b8-23c3b6869c1c}",
                "hidden": false,
                "name": "Developer PowerShell for VS 2022 [Preview]",
                "source": "Windows.Terminal.VisualStudio"
            },
            {
                "colorScheme": "Campbell",
                "font": 
                {
                    "face": "Cascadia Mono"
                },
                "guid": "{574e775e-4f2a-5b96-ac1e-a2962a402336}",
                "hidden": false,
                "name": "PowerShell",
                "source": "Windows.Terminal.PowershellCore"
            },
            {
                "guid": "{16208362-94fc-5b1f-a491-5b2624d5ab56}",
                "hidden": true,
                "name": "Visual Studio Debug Console",
                "source": "VSDebugConsole"
            }
        ]
    },
    "schemes": 
    [
        {
            "background": "#0C0C0C",
            "black": "#0C0C0C",
            "blue": "#0037DA",
            "brightBlack": "#767676",
            "brightBlue": "#3B78FF",
            "brightCyan": "#61D6D6",
            "brightGreen": "#16C60C",
            "brightPurple": "#B4009E",
            "brightRed": "#E74856",
            "brightWhite": "#F2F2F2",
            "brightYellow": "#F9F1A5",
            "cursorColor": "#FFFFFF",
            "cyan": "#3A96DD",
            "foreground": "#CCCCCC",
            "green": "#13A10E",
            "name": "Campbell",
            "purple": "#881798",
            "red": "#C50F1F",
            "selectionBackground": "#FFFFFF",
            "white": "#CCCCCC",
            "yellow": "#C19C00"
        },
        {
            "background": "#012456",
            "black": "#0C0C0C",
            "blue": "#0037DA",
            "brightBlack": "#767676",
            "brightBlue": "#3B78FF",
            "brightCyan": "#61D6D6",
            "brightGreen": "#16C60C",
            "brightPurple": "#B4009E",
            "brightRed": "#E74856",
            "brightWhite": "#F2F2F2",
            "brightYellow": "#F9F1A5",
            "cursorColor": "#FFFFFF",
            "cyan": "#3A96DD",
            "foreground": "#CCCCCC",
            "green": "#13A10E",
            "name": "Campbell Powershell",
            "purple": "#881798",
            "red": "#C50F1F",
            "selectionBackground": "#FFFFFF",
            "white": "#CCCCCC",
            "yellow": "#C19C00"
        },
        {
            "background": "#282C34",
            "black": "#282C34",
            "blue": "#61AFEF",
            "brightBlack": "#5A6374",
            "brightBlue": "#61AFEF",
            "brightCyan": "#56B6C2",
            "brightGreen": "#98C379",
            "brightPurple": "#C678DD",
            "brightRed": "#E06C75",
            "brightWhite": "#DCDFE4",
            "brightYellow": "#E5C07B",
            "cursorColor": "#FFFFFF",
            "cyan": "#56B6C2",
            "foreground": "#DCDFE4",
            "green": "#98C379",
            "name": "One Half Dark",
            "purple": "#C678DD",
            "red": "#E06C75",
            "selectionBackground": "#FFFFFF",
            "white": "#DCDFE4",
            "yellow": "#E5C07B"
        },
        {
            "background": "#FAFAFA",
            "black": "#383A42",
            "blue": "#0184BC",
            "brightBlack": "#4F525D",
            "brightBlue": "#61AFEF",
            "brightCyan": "#56B5C1",
            "brightGreen": "#98C379",
            "brightPurple": "#C577DD",
            "brightRed": "#DF6C75",
            "brightWhite": "#FFFFFF",
            "brightYellow": "#E4C07A",
            "cursorColor": "#4F525D",
            "cyan": "#0997B3",
            "foreground": "#383A42",
            "green": "#50A14F",
            "name": "One Half Light",
            "purple": "#A626A4",
            "red": "#E45649",
            "selectionBackground": "#FFFFFF",
            "white": "#FAFAFA",
            "yellow": "#C18301"
        },
        {
            "background": "#002B36",
            "black": "#002B36",
            "blue": "#268BD2",
            "brightBlack": "#073642",
            "brightBlue": "#839496",
            "brightCyan": "#93A1A1",
            "brightGreen": "#586E75",
            "brightPurple": "#6C71C4",
            "brightRed": "#CB4B16",
            "brightWhite": "#FDF6E3",
            "brightYellow": "#657B83",
            "cursorColor": "#FFFFFF",
            "cyan": "#2AA198",
            "foreground": "#839496",
            "green": "#859900",
            "name": "Solarized Dark",
            "purple": "#D33682",
            "red": "#DC322F",
            "selectionBackground": "#FFFFFF",
            "white": "#EEE8D5",
            "yellow": "#B58900"
        },
        {
            "background": "#FDF6E3",
            "black": "#002B36",
            "blue": "#268BD2",
            "brightBlack": "#073642",
            "brightBlue": "#839496",
            "brightCyan": "#93A1A1",
            "brightGreen": "#586E75",
            "brightPurple": "#6C71C4",
            "brightRed": "#CB4B16",
            "brightWhite": "#FDF6E3",
            "brightYellow": "#657B83",
            "cursorColor": "#002B36",
            "cyan": "#2AA198",
            "foreground": "#657B83",
            "green": "#859900",
            "name": "Solarized Light",
            "purple": "#D33682",
            "red": "#DC322F",
            "selectionBackground": "#FFFFFF",
            "white": "#EEE8D5",
            "yellow": "#B58900"
        },
        {
            "background": "#000000",
            "black": "#000000",
            "blue": "#3465A4",
            "brightBlack": "#555753",
            "brightBlue": "#729FCF",
            "brightCyan": "#34E2E2",
            "brightGreen": "#8AE234",
            "brightPurple": "#AD7FA8",
            "brightRed": "#EF2929",
            "brightWhite": "#EEEEEC",
            "brightYellow": "#FCE94F",
            "cursorColor": "#FFFFFF",
            "cyan": "#06989A",
            "foreground": "#D3D7CF",
            "green": "#4E9A06",
            "name": "Tango Dark",
            "purple": "#75507B",
            "red": "#CC0000",
            "selectionBackground": "#FFFFFF",
            "white": "#D3D7CF",
            "yellow": "#C4A000"
        },
        {
            "background": "#FFFFFF",
            "black": "#000000",
            "blue": "#3465A4",
            "brightBlack": "#555753",
            "brightBlue": "#729FCF",
            "brightCyan": "#34E2E2",
            "brightGreen": "#8AE234",
            "brightPurple": "#AD7FA8",
            "brightRed": "#EF2929",
            "brightWhite": "#EEEEEC",
            "brightYellow": "#FCE94F",
            "cursorColor": "#000000",
            "cyan": "#06989A",
            "foreground": "#555753",
            "green": "#4E9A06",
            "name": "Tango Light",
            "purple": "#75507B",
            "red": "#CC0000",
            "selectionBackground": "#FFFFFF",
            "white": "#D3D7CF",
            "yellow": "#C4A000"
        },
        {
            "background": "#000000",
            "black": "#000000",
            "blue": "#000080",
            "brightBlack": "#808080",
            "brightBlue": "#0000FF",
            "brightCyan": "#00FFFF",
            "brightGreen": "#00FF00",
            "brightPurple": "#FF00FF",
            "brightRed": "#FF0000",
            "brightWhite": "#FFFFFF",
            "brightYellow": "#FFFF00",
            "cursorColor": "#FFFFFF",
            "cyan": "#008080",
            "foreground": "#C0C0C0",
            "green": "#008000",
            "name": "Vintage",
            "purple": "#800080",
            "red": "#800000",
            "selectionBackground": "#FFFFFF",
            "white": "#C0C0C0",
            "yellow": "#808000"
        }
    ],
    "showTabsInTitlebar": true,
    "theme": "dark",
    "themes": []
}
int2e commented 8 months ago

What configuration do you have on the default terminal app at Initialization on the Windows Terminal?

Confirm it is Windows Terminal

int2e commented 8 months ago

git branch

git
tig commented 8 months ago

I noticed the other day that Windows Terminal rendering broke again in v2_develop for some wide chars on one of my machines. The machine I'm on right now is not reproducing it.

It might be font related. @int2e, what font do you have set in Windows Terminal?

tig commented 8 months ago

@tig see that the "Yes" and "No" buttons aren't output well. This is really a bug in this case.

Seems like it. Can you file an issue with all the steps you did to repo?

@tig see the second image where the scroll bar is showing and spoiling the output. This is related with the fact that is needed to distinguish between _isWindowsTerminal for using true color and using alternate buffer when debugging on VS2022. Alternate buffer is only supported on Windows if it's using Windows Terminal. Thus the "WT_SESSION": "yes" on the lauchSettings.json isn't suffice.

Not sure I agree. I think this is a problem with the resize handling code. But I'll continue to look at it.

int2e commented 8 months ago

I noticed the other day that Windows Terminal rendering broke again in v2_develop for some wide chars on one of my machines. The machine I'm on right now is not reproducing it.

It might be font related. @int2e, what font do you have set in Windows Terminal?

Cascadia Mono

I tried using MesloLGMNerdFont-Regular.ttf and also tried other fonts, but the problem remains.

BDisp commented 8 months ago

Seems like it. Can you file an issue with all the steps you did to repo?

@tig since I'm using the sample code posted here can we use this issue. Maybe changing the title.

Not sure I agree. I think this is a problem with the resize handling code. But I'll continue to look at it.

@tig see my updated comment (https://github.com/gui-cs/Terminal.Gui/issues/2928#issuecomment-1774088608), please.

BDisp commented 8 months ago

@int2e I already can repro this issue too:

image

int2e commented 8 months ago

@int2e I already can repro this issue too:

@BDisp what have you done?

BDisp commented 8 months ago

@int2e I already can repro this issue too:

@BDisp what have you done?

Only by forcing _isWindowsTerminal = false and Force16Colors = true.

int2e commented 8 months ago

Only by forcing _isWindowsTerminal = false and Force16Colors = true.

Where is it set? Do you have screenshots?

BDisp commented 8 months ago

The bug is with the wide characters that are in the BMP range but occupies two columns.

int2e commented 8 months ago

Is this a bug in v2 since v1 works

tig commented 8 months ago

@BDisp just to confirm, #2932 fixes this?

BDisp commented 8 months ago

@BDisp just to confirm, #2932 fixes this?

No, I'll submit on another PR when I finish it.

BDisp commented 8 months ago

@tig please reconsidere to use the previous glyphs for left and right brackets [ ] because WindowsDriver doesn't handle them appropriate in all situations if true colors aren't supported. I already confirmed that the correct string is passe to the write to console but sometimes isn't well rendered.

image

tig commented 8 months ago

@tig please reconsidere to use the previous glyphs for left and right brackets [ ] because WindowsDriver doesn't handle them appropriate in all situations if true colors aren't supported. I already confirmed that the correct string is passe to the write to console but sometimes isn't well rendered.

image

Do you think this directly relates to the problem with Chinese characters in this Issue?

When I chose the Glyphs for Button I had an instinct that they might surface an issue at some point. I realized this because they are on the edge of a View that has no Frame and thus would run up against the drawing of the SuperView. We know that terminals deal in cells and that the handling of Glyphs with "ColumnWidth" > 1 requires special handling for cells that abut. Looks like my instinct was correct, so I'm glad I chose those Glyphs.

The correct approach here is to engineer the right solution. The incorrect approach is to just go back to [ and ] without first understanding precisely why '⟦' and '⟧' are not working properly. If, after we understand the root issue, we determine it's not possible to engineer a solution to support them we can go back.

If you think you understand exactly why they are not working, please explain! Thanks.

BDisp commented 8 months ago

This isn't related with Chinese characters. Run the scenario Buttons with host console and you'll see the same. I really don't know why this happens but I'm sure the right string are passed to the console.

image

xiongnemo commented 2 months ago

Hi all, I comes from https://github.com/microsoft/terminal/issues/17016.

Is this a bug in v2 since v1 works

No, I think neither v1 and v2 seems to work correctly on wide glyphs :

v1 (develop), with conhost: image

v2 (v2_develop), with conhost: image

See the original issue for new wt behaviour.

Quoted from member from wt:

I believe you're accidentally writing "garbage" / invalid characters into your output. So far we just happened to ignore them but it seems that now we don't. I think this may be caused by https://github.com/microsoft/terminal/pull/16825 which was an intentional change.