구성요소에 대한 Playbook 리플로우

  • 릴리스 버전: Washingtondc
  • 업데이트 날짜 2024년 02월 01일
  • 읽기3분

    • 창 또는 확대/축소 크기를 조정할 때 UI가 조정되도록 바로 사용 가능한 독립 실행형 및 사용자 지정 레이아웃 플레이북 경험 구성요소에 리플로우를 적용합니다.

    리플로우는 Configurable Workspace 브라우저 설정을 통해 페이지와 콘텐츠를 최대 400%까지 확대할 수 있는 기능입니다. Playbook 리플로우가 활성화된 Playbook 경우 200% 브라우저 확대/축소로 확대하면 컴팩트 모드로 변경되고 다시 축소하면 컴팩트 모드가 종료됩니다.

    구성 요소에 대해 플레이북 경험 리플로우를 사용하려면 을 참조하십시오 구성요소에 Playbook 리플로우 적용.

    리플로우에 대한 자세한 내용은 을 참조하십시오 Reflow for Configurable Workspace.

    구성요소에 Playbook 리플로우 적용

    창 또는 확대/축소 크기를 조정할 때 UI가 조정되도록 즉시 사용 가능한 독립 실행형 및 사용자 지정 레이아웃 플레이북 경험 구성요소에 리플로우를 적용합니다.

    시작하기 전에

    필요한 역할: admin

    프로시저

    1. sys_ux_auto_reflow_rule 기록을 생성합니다.
      1. 모두 메뉴를 엽니다.
      2. 필터 표시줄에 sys_ux_auto_reflow_rule.list를 입력하고 입력합니다.

      UX 자동 리플로우 규칙 목록이 생성되고 표시됩니다.

      독립 실행형 및 사용자 지정 레이아웃 구성요소 각각 Playbook 에 대한 규칙이 있습니다. 특정 UI 빌더 페이지 크기 미만인 경우 이러한 규칙은 기본 리플로우 엔진을 사용하여 UX Macroponent 정의 목록(sys_ux_macroponent.list)의 macroponent 속성과 특정 CSS 값을 재정의합니다. 스토어 앱에 제공된 플레이북 경험 규칙은 640px 페이지 너비를 사용하여 구성 요소의 compactMode 속성을 전환하고 100vh 높이를 사용하여 구성 요소의 크기가 공간에 맞게 조정되도록 합니다.

      독립 실행형 구성 요소를 사용하는 경우 작업이 완료됩니다. 사용자 지정 레이아웃 구성요소로 작업하는 경우 다음 단계로 진행합니다.

    2. 다음으로 이동 모두 > UI Builder레이블이 표시됩니다.
    3. Builder에서 Reflow를 적용할 레이아웃을 플레이북 경험 엽니다.
    4. 왼쪽 하단 모서리에서 데이터 아이콘을 선택하고 Playbook 사용자 지정 레이아웃 UI 컨트롤러를 엽니다.
    5. 활동 보기 모드 필드에서 stagePickerVisible 출력 속성 값을 true로 업데이트합니다.
    6. 리플로우 규칙을 적용할 구성요소를 선택합니다.
    7. 이벤트 탭에서 Compact Mode Changed 이벤트 처리기를 추가합니다.
      이렇게 하면 compactMode output 속성의 값을 true 또는 false로 변경하여 리플로우 규칙에 따라 Compact Mode를 자동으로 켜고 끕니다. 그런 다음 다른 구성 요소에 Playbook 적용되어 모든 것이 자동으로 크기가 조정됩니다.
    8. 옵션: 크기 조정 가능한 창을 선택합니다.
      1. 창 위치를업데이트하여 왼쪽 및 오른쪽 방향 또는 위쪽 및 아래쪽 창으로 표시합니다.
      2. 구성 탭에서 기본 표시 창 필드에서 스크립팅된 속성 값을 엽니다.
      3. 컴팩트 모드가 아닌 경우 "왼쪽"/"위쪽" 창, "오른쪽"/"아래쪽" 창만 표시하거나 "둘 다" 창을 표시하도록 if(!api.data.playbook_custom_layout.compactMode) return 값을 업데이트합니다.
      4. 컴팩트 모드의 경우 반환의 첫 번째 값 (api.data.playbook_custom_layout. selectedItem || ()).stageContextId ? 스테이지를 선택할 때 "왼쪽"/"상단" 또는 "오른쪽"/"하단" 활동 창을 표시합니다.
        두 번째 값은 스테이지를 선택하지 않을 때 표시할 창을 나타냅니다.