커스텀 대기 스피너 - Spectre Console 시리즈

내장 스피너 사용

팀은 간단한 예시부터 시작합니다. 0:37에 그는 AnsiConsole.Status를 사용하여 백그라운드에서 작업이 실행되는 동안 알려진 스피너 스타일을 표시하는 코드를 작성합니다. 그는 Spinner.Known.Aesthetic을 선택했지만 Spectre가 Spinner.Known 목록에 다양한 옵션을 제공한다는 점을 지적했습니다. Tim은 사용자가 현재 상황을 알 수 있도록 스피너 옆에 "로딩 중"이라는 문자열을 추가했습니다.

Tim은 상태 블록 내부에 테스트를 위해 Thread.Sleep(10000) (10초)를 삽입합니다. 이렇게 하면 콘솔이 스피너가 작동하는 모습을 충분히 오랫동안 보여주게 되어 볼 수 있습니다. 그는 1분 23초에 작업이 완료되면 스피너가 자동으로 사라진다고 설명합니다. 이는 Spectre가 콘솔 애플리케이션에서 상태 또는 진행 상황을 표시할 때 권장하는 기본 패턴입니다.

맞춤형 스피너 제작을 향해 나아가기

1분 41초에 팀은 "좋아요, 이제 사용자 지정 스피너를 만들어 봅시다"라고 말하며 내장 옵션을 넘어서는 방법을 보여줍니다. 그는 때때로 스피너의 형식이나 스타일을 프로젝트, 브랜드 색상 또는 처리하는 데이터 유형에 맞게 조정하고 싶을 때가 있다고 설명합니다. 스피너 클래스를 직접 작성하면 프레임, 타이밍, 유니코드 문자 사용 여부 등을 제어할 수 있습니다.

스피너 클래스 만들기

Tim은 TestSpinner.cs라는 이름의 새 파일을 생성합니다. 2분 5초에 그는 해당 클래스를 공개하고 Spectre의 추상 클래스인 Spinner를 상속받도록 설정합니다. 그는 Visual Studio의 "추상 클래스 구현" 기능을 사용하여 필요한 멤버를 생성합니다. 여기서는 기본값을 사용하는 대신 속도, 프레임, 유니코드 설정과 같은 값을 직접 입력합니다.

Tim은 2분 18초에 이러한 속성들이 가져오기 전용 속성이므로 표현식 본문 멤버를 작성하기가 더 간단해진다고 강조합니다. 이 형식을 사용하면 스피너 정의를 간결하게 유지하여 나중에 유지 관리하거나 업데이트하기가 더 쉬워집니다.

프레임당 속도 제어

2:30에 Tim은 타이밍 속성을 TimeSpan.FromMilliseconds(200)으로 설정합니다. 즉, 스피너는 초당 약 5프레임으로 움직입니다. 그는 스피너의 회전 속도를 더 빠르게 또는 더 느리게 하고 싶다면 다른 값을 선택할 수 있다고 설명합니다. 이 설정을 조정하면 명령이나 프로세스가 수행하는 작업에 따라 로딩 애니메이션의 느낌을 쉽게 개선할 수 있습니다.

유니코드 문자 처리

3시에 팀은 핵심적인 문제인 유니코드에 대해 이야기합니다. 그는 Visual Studio의 내장 콘솔에서 프로젝트를 실행할 때 유니코드 문자가 올바르게 렌더링되지 않아 오류가 발생하거나 기호가 누락될 수 있다고 지적합니다. 하지만 윈도우 터미널이나 PowerShell에서 같은 프로젝트를 실행하면 유니코드와 이모지가 일반적으로 제대로 표시됩니다. 데모에서는 이 문제를 피하기 위해 해당 속성을 false로 설정했지만, 터미널에서 지원하는 경우 true로 설정할 수도 있다고 언급합니다.

이 기능을 사용하면 앱에 다채로운 기호, 화살표 또는 이모티콘 기반 진행 표시기를 더 쉽게 추가할 수 있습니다. ✅, 🌧, 🔄 또는 원하는 다른 문자를 사용하여 프레임을 꾸며 더욱 풍부한 정보를 제공할 수 있습니다.

프레임 정의하기

다음 속성은 프레임 목록입니다. 3시 34분에 Tim은 문자열 배열을 반환하는 화살표 함수를 작성합니다. 각각의 줄은 회전판의 "프레임" 하나를 나타냅니다. 그는 예시에서 큰 "O"와 여러 개의 작은 "o"를 사용하여 선을 가로지르는 움직임을 표현했습니다.

그는 기본 프레임을 다섯 번 복사해서 붙여넣은 다음, 4분 12초에 각 프레임에서 "O" 하나를 다른 위치에 바꿔 넣습니다. 이렇게 하면 간단한 애니메이션이 만들어집니다. 큰 "O"가 왼쪽에서 오른쪽으로 움직이는 것처럼 보이다가 다시 시작 위치로 돌아옵니다. Tim은 4분 26초에 프레임을 추가하여 방향을 반전시키거나, 색상 서식을 추가하거나(Spectre는 [green]text[/]와 같은 풍부한 마크업을 지원합니다), 콘솔에서 지원하는 경우 유니코드 문자를 사용해 볼 수 있다고 언급합니다.

Tim의 TestSpinner 클래스 코드는 다음과 같습니다.

using Spectre.Console;

namespaces SpectreDemos;

public class TestSpinner : Spinner
{
    public override TimeSpan Interval => TimeSpan.FromMilliseconds(200);

    public override bool IsUnicode => false;

    public override IReadOnlyList<string> Frames => 
    [
        "Ooooo",
            "oOooo",
            "ooOoo",
            "oooOo",
            "ooooO"
    ]
}

using Spectre.Console;

namespaces SpectreDemos;

public class TestSpinner : Spinner
{
    public override TimeSpan Interval => TimeSpan.FromMilliseconds(200);

    public override bool IsUnicode => false;

    public override IReadOnlyList<string> Frames => 
    [
        "Ooooo",
            "oOooo",
            "ooOoo",
            "oooOo",
            "ooooO"
    ]
}

사용자 정의 스피너 구현 및 테스트

클래스 정의가 완료되면 Tim은 다시 메인 프로그램으로 돌아갑니다. 4분 42초에 그는 Spinner.Known.Aesthetic을 new TestSpinner()로 교체합니다. 그게 전부입니다. 다른 코드 변경은 필요하지 않습니다. 그는 4시 52분에 애플리케이션을 실행하여 새로운 스피너가 작동하는 모습을 보여줍니다.

이 테스트 단계는 중요합니다. Tim은 인코딩, 색상 또는 타이밍 문제를 조기에 발견할 수 있도록 사용자들이 사용할 터미널과 동일한 터미널에서 프로젝트를 실행할 것을 권장합니다. 다른 셸과 글꼴은 스피너의 모양에 영향을 줄 수 있습니다.

유니코드, 이모지 및 색상 추가

팀은 5분에 유니코드를 활성화하면 이모티콘이나 특수 문자를 프레임으로 사용하는 데 아무런 문제가 없다고 설명합니다. Spectre의 마크업을 사용하여 날씨 스피너, 녹색 진행률 표시줄 또는 애플리케이션에 맞는 창의적인 디스플레이를 만들 수 있습니다. 이는 특히 실행 시작이나 지속에 오랜 시간이 걸리는 명령에 유용합니다. 사용자들이 명확한 시각적 피드백을 선호하기 때문입니다.

그는 또한 Spectre Console을 사용하면 스피너에 색상과 서식 있는 텍스트를 더 쉽게 추가할 수 있다고 언급했습니다. 예를 들어, 성공을 강조하기 위해 스피너 옆에 [녹색]로딩 중...[/]을 쓰거나, 필요한 경우 오류를 빨간색 텍스트로 강조 표시할 수 있습니다.

성능 향상 팁 및 설정

5분 19초에 Tim은 맞춤형 스피너를 만드는 데 필요한 핵심 사항들을 요약합니다.

• 시간: 각 프레임이 표시되는 시간.

• IsUnicode: 유니코드/이모지를 사용할지 일반 텍스트를 사용할지 결정합니다.

• 프레임: 애니메이션을 적용할 문자열 배열입니다.

그는 프레임 수가 너무 많거나 속도가 너무 느리면 프로세스 시간이 매우 길지 않은 한 사용자가 마지막 프레임을 볼 수 없을 수도 있다고 경고합니다. 여기서 적절한 옵션을 선택하면 스피너의 효율성이 향상됩니다. 또한 이러한 설정을 통해 프로젝트를 점진적으로 확장하는 것이 더 쉬워집니다. 콘솔 애플리케이션 전체를 다시 작성하지 않고도 프레임을 추가하거나 타이밍을 조정할 수 있습니다.

마무리

5분 38초에 Tim은 Spinner 클래스를 상속받고 사용자 지정 값을 제공함으로써 콘솔이나 PowerShell 기반 도구에 사용할 사용자 지정 로딩 표시기를 빠르게 만들 수 있음을 보여줍니다. 이를 통해 사용자에게 제공하는 정보와 느낌을 더욱 효과적으로 제어할 수 있습니다. 5분 47초에 그는 시청자들에게 소스 코드와 문서가 영상 설명란에 있으니 직접 살펴보고 확장해 볼 수 있다고 알려줍니다.

결론

Tim Corey의 비디오를 통해 Spectre 콘솔 로딩 스피너를 사용자 지정하는 방법을 정확히 살펴보았습니다. Spinner 클래스를 상속하고, 타이밍 값을 제공하고, 유니코드 지원을 지정하고, 프레임을 정의하면 됩니다. 그런 다음 기존의 스피너를 새 클래스로 교체하기만 하면 프로젝트에 추가할 수 있습니다. Tim은 또한 콘솔 앱의 상태 및 진행 상황 표시를 더욱 유익하고 보기 좋게 만들기 위해 유니코드 문자, 이모지 및 색상 마크업을 추가하는 방법을 제시합니다.

Spectre Console의 기능을 활용하면 더욱 명확한 피드백을 제공하고, 문제를 조기에 찾아 해결하며, 사용자가 만족할 만한 아름다운 콘솔 애플리케이션을 만들 수 있습니다.