NGMsoftware

NGMsoftware
로그인 회원가입
  • 매뉴얼
  • 팁 앤 테크
  • 매뉴얼

    팁과 테크니컬 노하우를 확인하세요.

    팁 앤 테크

    팁과 테크니컬 노하우를 확인하세요.

    본 사이트의 컨텐츠는 저작권법의 보호를 받으므로 무단 복사, 게재, 배포 등을 금합니다.

    디자이너 매크로 제작하기. (인증 로그인 및 옵션 콘피그 설정)

    페이지 정보

    본문

    안녕하세요. 엔지엠소프트웨어입니다. 엔지엠 매크로를 만들고, 엔지엠 매크로 플레이어가 아닌 나만의 매크로를 만들고 싶은경우 엔지엠 디자이너를 사용하시면 됩니다. 디자이너는 플레이어를 만들 수 있는 프레임워크로 직접 매크로 플레이어를 디자인하고 새로운 기능(?)들을 추가할 수 있습니다. 하지만, 어느정도 개발에 대한 지식이 필요하고 C# 언어로 코딩할 수 있어야 합니다. 아래와 같은 플레이어를 만들 수 있습니다.

    r5zWiv3.png

     

     

    디자이너를 사용하려면 엔지엠 매크로 엔터프라이즈(에디터, 플레이어) 라이센스가 필요합니다. 엔터프라이즈 등급의 에디터와 플레이어 라이센스를 가지고 있으면, [ 고객 서비스 ] 카카오톡 대화방에서 디자이너를 요청하세요. 아래와 같은 설치 파일을 받은 후 설치해야 합니다. NUI.msi 또는 setup.exe를 더블 클릭하면 설치가 진행됩니다.

    8L1TzJz.png

     

     

    엔지엠 디자이너 설치하기.

    관리자로부터 NGI.msi 파일을 받은 후 컴퓨터의 적당한 곳에 복사합니다. 그리고, 더블 클릭하여 설치하세요.

    BFpx4qT.png

     

     

    동의함을 선택하고, 다음을 클릭하세요.

    ywVIuQ4.png

     

     

    다음을 클릭하세요.

    PeVuEMw.png

     

     

    다음을 클릭하세요.

    Bwy22cz.png

     

     

    NGI가 설치될 동안 잠시 기다립니다.

    335vqjO.png

     

     

    설치가 완료되면, 닫기를 누르세요.

    CKwgM9n.png

     

     

    엔지엠 디자이너 삭제하기.

    윈도우의 제어판을 실행하세요.

    OREiVLh.png

     

     

    프로그램 및 기능을 클릭하세요.

    MfXAs7g.png

     

     

    NGI를 선택하고 우클릭 후 삭제하세요.

    tYWVX8C.png

     

     

    Visual Studio 설치하기

    디자이너를 이용해서 플레이어를 만들려면 Visual Studio 2022 Community를 설치해야 합니다.

    [ Visual Studio Community 다운로드 ]

     

    설치가 완료되면 비주얼 스튜디오를 실행한 후 "새 프로젝트 만들기"를 클릭하세요.

    Rk07h8R.png

     

     

    디자이너 프로젝트 만들기

    Windows Forms 앱(.NET Framework) 프로젝트를 만들기 아래 그림을 참고해서 따라해보세요.

    1. 언어는 C# 선택
    2. 플렛폼은 Windows 선택
    3. 프로젝트 형식은 데스크톱 선택
    4. Windows Forms 앱(.NET Framework) 선택
    5. 다음 클릭

    K6nK4en.png

     

     

    프로젝트 이름에 MyPlayer를 입력한 후 위치를 설정하세요. 이 예제에서는 기본 위치를 사용합니다. 마지막으로 프레임워크를 4.6.1로 선택하고 만들기를 클릭하세요.

    jRpmcKY.png

     

     

    여기까지 하면 아래와 같은 윈폼 프로젝트가 생성됩니다. 현업에서는 Windows Forms를 줄여서 윈폼이라고 부릅니다. 보시면 아시겠지만~ 엔지엠 에디터와 비슷한 화면 구성을 가지고 있습니다. 대부분의 IDE가 이런 구성을 가지는데요. 가장 효율적으로 많은 정보를 표시할 수 있는 UI/UX라고 보면 될거 같습니다. 저는 뭔가 할때마다 새창이 뜨는걸 별로 안좋아 합니다. 작업의 흐름을 방해하기 때문이죠^^;

    9aRGw50.png

     

     

    이 글에서 디자인(UI 구성)을 해볼건 아니라서 기본 화면으로 진행할께요. 우측의 솔루션 탐색기(Ctrl+Alt+L)에서 프로젝트(MyPlayer)를 확장하고 참조에서 우클릭하세요. 그리고, 참조 추가를 클릭합니다.

    05stbwG.png

     

     

    찾아보기를 클릭하세요.

    uw6o6vQ.png

     

     

    엔지엠 디자이너가 설치되어 있는 폴더로 이동하세요. 기본 설치라면 "C:\Users\<사용자>\source\repos\NGM_Workspace\NGM2021\Container\NUI32" 이 위치에서 "Designer.dll"을 찾을 수 있습니다.

    디자이너 환경 설정하기 내용 참고 ]

    6eCzRsk.png

     

     

    솔루션 탐색기에 "Designer"가 추가되었습니다.

    디자이너 환경 설정하기 최신 내용 참고 ]

    eWdrSag.png

     

     

    이제 디자이너에서 제공해주는 콤포넌트와 컨트롤을 추가해야 합니다. 좌측의 도구 상자(Ctrl+Alt+X)에서 우클릭 후 탭 추가를 클릭하세요.

    OY9L2EV.png

     

     

    NGM Designer를 입력한 후 해당 탭에서 우클릭하세요. 그리고 항목 선택을 클릭합니다.

    82JgtIQ.png

     

     

    엔지엠 디자이너가 설치된 폴더로 이동하여 솔루션 탐색기에서 선택했던 "Designer.dll"을 선택해줍니다. 아래 그림처럼 콘트롤들이 추가되는걸 알 수 있습니다.

    hRtLEot.png

     

     

    디자이너 템플릿 적용하는 방법

    이제 기본적으로 만들어져 있는 디자이너를 적용 해볼까요? 아래 링크에서 파일을 다운로드 받으세요.

    [ 엔지엠 6 중급 메트로 디자인 v2 다운로드 ]

     

    압축을 풀면 아래 그림과 같이 2개의 파일이 들어 있습니다.

    RdOrjnK.png

     

     

    프로젝트에서 우클릭하면 "파일 탐색기에서 폴더 열기" 메뉴가 보입니다. 클릭하세요. 폴더가 열리면 위의 2개 파일을 붙여넣기하세요.

    cQFCVJL.png

     

     

    namespace가 기본적으로 NGMsoftwareDesigner로 되어 있습니다. 이걸 프로젝트명으로 변경하세요. 아래 그림을 참고로 하면, namespace DesignerTest가 됩니다.

    DdWhpcu.png

     

     

    Form1.Designer.cs 파일도 동일하게 네임스페이스를 변경 해줍니다.

    VyssDro.png

     

     

    스크립트 열기 기본 위치 설정

    스크립트 열기에서 기본 폴더를 설정하려면 아래와 같이 코드를 변경하면 됩니다. dialog 인스턴스의 InitialDirectory 속성에 기본 위치를 넣어주면 됩니다. 기본 위치는 마음대로 설정해도 되지만, 아래 예제에서는 프로그램이 실행되는 위치 아래 Script 폴더를 설정 했습니다. 디자이너 매크로 플레이어를 판매할 때 bin/Debug 폴더를 전체 압축할텐데요. 이 안에 Script, Image 폴더가 같이 있어야 합니다.

            private void openScriptToolStripMenuItem_Click(object sender, EventArgs e)
            {
                OpenFileDialog dialog = new OpenFileDialog();
                dialog.DefaultExt = ".ngs";
                dialog.InitialDirectory = Path.Combine(Application.StartupPath, "Script");

     

    매크로 로그인

    프로그램을 실행 해보세요. 디자이너로 만든 플레이어를 최초로 실행하면 아래와 같이 로그인이 표시됩니다. 기본적으로 인증은 엔지엠소프트웨어와 동일합니다. 아이피와 인증키를 복사해서 컴퓨터를 등록해야 합니다. 컴퓨터 등록 방법은 [ 고객센터 > 자주하는 질문 ]의 첫번째와 두번째 글을 참고하시면 됩니다.

    HsOJErw.png

     

     

    로그인창에서 도움말 보기와 관리자에게 문의하기 버튼을 클릭하면 엔지엠소프트웨어의 홈페이지로 연결됩니다. 이걸 자신의 홈페이지 또는 카카오톡으로 연결하고 싶으면 아래와 같이 변경할 수 있습니다. 코드 보기 상태에서 아래 코드를 추가하세요.

    hZzFPda.png

     

     

    사실, 인증 관련해서 자신의 데이타베이스에서 처리하고 싶을수도 있습니다. 사용자 정보를 처리할 수 있는 Database가 있고, 인증 처리에 필요한 API를 개발할 수 있으면 로그인폼을 직접 만들어서 추가할수도 있습니다. 이 부분을 처리할 수 있다면 Program.cs에서 폼이 실행되기 전 인증 처리 로직을 추가하고 인증 결과에 따라 실행 여부를 설정하면 됩니다. 이와 관련된 내용은 글 하나로 다 작성할 수 없기 때문에 필요하시면 별도의 교육으로 만들어 드리도록 하겠습니다. 

    1. 인증 제작 비용: 1,570,000원 (VAT 포함)
    2. 인증 제작 기간: 2일
    3. 인증 제작 내용: 웹호스팅 데이타베이스 구성, 엔지엠 디자이너 로그인 폼 개발, 엔지엠 로그인 자동 처리 개발
      ※ 호스팅 비용은 호스팅 서비스 회사에 따라 상이합니다.

     

    매크로 옵션 설정하기

    기본 디자인에서 몇가지 추가적인 기능들을 추가해 보도록 하겠습니다. 엔지엠 플레이어의 옵션에서 성능 설정을 디자이너에서 사용하도록 해볼께요. 다른 옵션 설정들도 방식은 동일하니 아래 내용을 참고해서 응용하면 추가적으로 개발이 가능합니다.

    9X4LSAk.png

     

     

    우선, 옵션 설정들을 저장하고 있는 데이타 모델을 불러옵니다. OptionConfigModel이라는 변수를 private 접근 한정자로 추가합니다. NGM.Client.SystemHelper.GetOptionConfig(this.Text) 메소드를 이용해서 엔지엠 매크로의 옵션을 가져옵니다.

    namespace DesignerTest
    {
        public partial class Form1 : Designer.ComponentMetro.MainView
        {
            private FileInfo _logFile;
    
            private OptionConfigModel option;
    
            public Form1()
            {
                InitializeComponent();
                NGM.Utility.MouseKeyboardManager.HookManager.KeyUp += HookManager_KeyUp;
    
                this.HomePageURL = "자신의 홈페이지 주소";
                this.HelpURL = "매크로 사용법이 있는 홈페이지 게시판 주소";
                this.ContactAdminLink = "관리자에게 문의하기 ex) 텔레그램 또는 카카오톡 연결 주소";
    
                option = NGM.Client.SystemHelper.GetOptionConfig(this.Text);
            }

     

    아래와 같이 option에서 인텔리센스(.)를 활성화하면 다양한 옵션들을 확인할 수 있습니다. 성능 설정은 PerformanceSettings 속성입니다.

                option = NGM.Client.SystemHelper.GetOptionConfig(this.Text);
                option.PerformanceSettings = 100;

     

    설정을 변경했으면, 저장해야 적용됩니다. SaveOptionConfig 메소드로 쉽게 저장할 수 있습니다.

                option = NGM.Client.SystemHelper.GetOptionConfig(this.Text);
                option.PerformanceSettings = 100;
                NGM.Client.SystemHelper.SaveOptionConfig(this.Text, option);

     

    SystemHelper 클래스는 엔지엠 매크로 시스템을 조작할 수 있는 다양한 방법들을 제공합니다. 인텔리센스는 인스턴스에 점을 찍으면 자동으로 동작합니다. 이 인스턴스가 사용할 수 있는 공개된 메소드를 보여줍니다. 엔지엠 매크로에서 사용할 수 있는 대부분의 옵션을 디자이너에서도 사용할 수 있습니다.

    odbWorq.png

     

     

    옵션 콘피그 모델을 불러오거나 저장할 때 기본적으로 this.Text 값을 첫번째 인자로 넘겨줘야 합니다. this.Text는 사용자가 만들고 있는 디자이너 플레이어의 이름입니다. 옵션에 이름이 필요한 이유는 멀티 실행시 각각의 옵션이 적용되어야 하기 때문입니다. 플레이어마다 이름이 다르면 자신의 이름으로 옵션을 불러옵니다. e 폴더에 보면 플레이어 이름으로 옵션 파일들이 생성되는걸 알 수 있고, 이 옵션들을 사용함으로써 각각의 플레이어가 다른 옵션을 적용받게 됩니다.

    gaH9fQE.png

     

     

    폼(Form) 디자인도 사용자가 마음데로 구성할 수 있습니다. 이런 디자인적인 요소는 사용자마다 다를 수 있습니다. 다양한 방식으로 각자 플레이어를 만들 수 있고, 외부 라이브러리 또는 모듈을 직접 추가해서 기능을 확장할수도 있습니다. 물론, 스크립트를 변경하는 것도 가능합니다. 실행, 중지 버튼을 [ 단축키 ]로 설정할수도 있습니다. 다양한 예제들이 있으니 디자이너 제작 도움말을 하나씩 참고 해보세요^^

     

    개발자에게 후원하기

    MGtdv7r.png

     

    추천, 구독, 홍보 꼭~ 부탁드립니다.

    여러분의 후원이 빠른 귀농을 가능하게 해줍니다~ 답답한 도시를 벗어나 귀농하고 싶은 개발자~

    감사합니다~

    • 네이버 공유하기
    • 페이스북 공유하기
    • 트위터 공유하기
    • 카카오스토리 공유하기
    추천0 비추천0

    댓글목록

    등록된 댓글이 없습니다.