PHPStorm Plugin 개발 | #3. 툴바 메뉴 추가하기(Action, plugin.xml)

보람·2022년 4월 25일
0

IDE-PLUGIN-만들기

목록 보기
4/7
post-thumbnail

지난글 | PHPStorm Plugin 개발 | #2. 프로젝트 환경 설정 및 실행

(이 글은 수정될 수 있습니다🌝)

PHPStorm과 같은 IDE 상단에 보면 툴바와 메뉴들이 있다.
해당 메뉴를 추가하거나 메뉴를 클릭했을 때 어떤 행위를 하는지를 지정하려면 어떻게 해야할까?
그럴 때 쓸 수 있는게 이번글에서 작성하는 Action과 plugin.xml 이다.

Action

Action은 플러그인이 IntelliJ Platform 기반 IDE 메뉴 및 도구 모음에 항목을 추가할 수 있는 확장 지점이다. 예를 들어 파일|파일열기 메뉴나 파일열기 버튼이 하나의 액션 클래스이다.

IntelliJ Platform의 액션은 코드 구현과 명시를 필요로 한다. 구현작업이 되고 등록된 액션은 사용자 행위 발생시 IntelliJ Platform으로부터 콜백을 받는다.

번역을 하니까 이상한데..
어떤 메뉴를 추가하고 그 메뉴를 눌렀을 때 행위를 구현하는 것을 Action에서 할 수 있다!

앱을 구현할때도 어떤 버튼이 어디에 위치하고 버튼을 클릭했을 때 어떤 행위를 할거냐를 구현하는 것과 비슷한 느낌이다.
예전에 워드프레스 플러그인을 만들때도 action이라는 함수가 있었는데 해당 action이 발생되면 어떤 행위를 한다 라는 것을 작업했던 기억이 있다 : )

Action 구현

Action은 추상 클래스인 AnAction을 상속받아 구현된다.
IntelliJ Platform은 메뉴나 툴바 버튼과 상호작용 할 때 액션 함수를 호출한다.

Action 클래스에서는 update()와 actionPerformed()를 오버라이드한다.

AnAction.update()

update()는 IntelliJ Platform 프레임워크에서 호출되어 동작 상태를 업데이트한다. 사용가능한지 표시 가능한지의 액션 상태에 따라서 IDE UI에서 액션의 사용 여부가 결정된다. AnActionEvent객체가 전달되어 현재 컨텍스트(작업중인 프로젝트 등등) 정보를 전달한다. 설명만 보면 잘 모르니 코드를 보자!

/**
  * @param e : 현재 해당 플러그인을 사용중인 프로젝트의 정보를 갖고있는 AnActionEvent 객체
 **/
override fun update(e: AnActionEvent) {
        // 프로젝트가 있다면 사용가능여부 바꾸기
        // 여기서 프로젝트란 해당 플러그인을 사용중인 프로젝트를 의미한다.
        val project = e.project
        e.presentation.isEnabledAndVisible = project != null
    }

AnAction.actionPerformed()

메뉴등을 눌렀을 때 actionPerformed()가 호출되고 해당 함수를 오버라이딩하면 해당 액션에 대한 동작을 구현할 수 있다.

    /**
     * actionPerformed()는 사용자가 메뉴나 툴바등을 클릭했을 때 호출되는 함수이다.
     * @param event 프로젝트, 파일 등에 액세스하는 데 사용되는 AnActionEvent 를 매개 변수로 받는다.
     */
    override fun actionPerformed(event: AnActionEvent) {
        //TODO 서비스 로직 구현하기
        //나같은 경우엔 하위메뉴 선택 이벤트 발생시 .env 파일 스위칭 로직을 추가했다.
    }

액션 추가하기 (plugin.xml)

개발하는 플러그인에서 어떤 액션을 지정할지에 대한 것은 plugin.xml 파일에 등록할 수 있다.
<actions> 태그에서 여러 액션을 지정할 수 있다.

나는 도구 툴바(tools) 첫번째에 하나의 그룹메뉴를 추가하기를 원했다.

    <actions>
        <!--도구메뉴에 추가된 그룹액션
            id : 해당 액션의 고유 아이디
            class : 해당 액션이 구현되는 액션 클래스 경로
            popup : "선택사항" - 그룹의 하위 메뉴들이 표시되는 방법을 지정
                * true - 그룹 작업이 하위 메뉴에 배치됩니다.
                * false - 작업은 동일한 메뉴의 섹션으로 표시됩니다.
            구분 기호로 구분됩니다.
            text : 추가된 메뉴 명
            description : 그룹메뉴 설명
        -->
        <group
                id="EnvSwitchMenuAction"
                class="com.boboram.laravelenvswitch.actions.EnvSwitchMenuAction"
                popup="true"
                text="Laravel Env Switch"
                description="Laravel Env Switch">
            <!--어디 그룹에 추가할것인가
                group-id : 툴바에 추가한다.
                anchor : 위치 first면 가장 위에 표시됨
            -->
            <add-to-group group-id="ToolsMenu"
                          anchor="first"/>
        </group>
    </actions>

위 plugin.xml을 통해서 생성된 그룹메뉴이다.
명시된대로 tool bar(도구) 그룹에 상단에 추가되었고 popup을 true로 지정하여 3개의 하위 메뉴가 "Laravel Env Switch" 오른쪽에 추가되었다.
만약에 popup=false 라면 아래 이미지와 같이 표시된다.

해당 세개의 하위 메뉴는 EnvSwitchMenuAction에서 ActionGroup을 통해서 메뉴 구현 및 행위 구현을 하였다.

DevKit로 액션 생성하기

plugin.xml에 명시하고 Action클래스를 만드는 것을 직접하지 않고 DevKit을 이용할 수 있다.
Action 클래스를 구현하고자 하는 폴더 경로에서 아래 이미지와 같이 선택한다.

경로 > 새로만들기 > 플러그인 DevKit > 액션

원하는 값 추가해서 확인버튼 누르면 생성 완료 : )

사실 원하는게 메뉴를 추가하고 메뉴를 눌렀을 때 구현되는 로직을 작성하면 되는 거여서 위 부분만 이해하면 됐다🌝

실제 로직은 아래 깃허브를 보면 될 것 같다!

사실 구현보다 더 어려웠던건 환경설정과 플러그인 출시였다ㅜㅜ

다음글에서는 gradle | signPlugin 을 실행하면서 발생한 문제와 출시에 대해 작성해보려 한다.

profile
백엔드 개발자

0개의 댓글