다음을 통해 공유


trackContainerResize

구성 요소가 반응해야 하는지 여부를 컨테이너 크기 조정을 결정합니다. 구성 요소가 표시 allocatedWidth 되거나 allocatedHeight 입력이 true이면 됩니다.

메서드를 trackContainerResize(true) 호출할 때 코드 구성 요소의 메서드 내에 updateView 제공될 예정입니다context.mode.allocatedHeight.context.mode.allocatedWidth 이러한 속성의 값은 코드 구성 요소가 호스트되는 위치에 따라 다릅니다. 값 -1 은 코드 구성 요소가 필요에 따라 사용 가능한 공간을 채우도록 CSS 스타일 규칙을 설정할 수 있음을 나타냅니다.

다음 표에서는 호스트 및 allocatedHeight 코드 구성 요소 수명 주기 메서드의 다양한 조합에 있는 값을 allocatedWidth 보여 줍니다.

Host 수명 주기 메서드 allocatedWidth allocatedHeight
모델 기반 및 캔버스 앱 init -1 -1
모델 기반 앱 updateView -1 인 경우 trackContainerResize(false) 또는
너비(픽셀)trackContainerResize(true)
브라우저 창의 크기가 조정되고 폼이 사용 가능한 공간으로 조정되면 너비가 변경됩니다.
-1
캔버스 앱 updateView 앱 작성자가 설정합니다.
너비가 Power FX 수식으로 설정된 경우 동적으로 변경할 수 있습니다.
앱 작성자가 설정합니다.
너비가 Power FX 수식으로 설정된 경우 동적으로 변경할 수 있습니다.

비고

테스트 도구(사용 npm start시작) allocatedHeightallocatedWidth 에서 숫자 대신 문자열로 반환됩니다. 값이 제공되지 않으면 -1 또는 정의되지 않은 문자열이 아닌 빈 문자열을 반환합니다. 또한 너비 또는 높이가 설정되면 브라우저를 새로 고치지 않고는 변경 내용을 실행 취소할 수 없으며, 대신 빈 값이 1 크기로 해석됩니다.

일반적으로 모델 기반 앱은 구성 요소의 높이와 너비를 제한하지 않으므로 컨테이너 크기를 추적할 필요가 없습니다. 대신 코드 구성 요소는 그리드 구성 요소에 대한 공간의 100% 또는 구성 요소를 렌더링할 때 콘텐츠에 필요한 특정 높이를 field 사용하도록 확장할 수 있습니다. 그러나 캔버스 앱에서 부모 컨텍스트는 항상 끌어서 놓기 편집기의 특성에 따라 구성 요소의 높이와 너비를 제공합니다.

다음 표에서는 컨트롤 HTML 콘텐츠의 높이와 너비를 제어하는 데 사용할 수 있는 전략을 보여 줍니다.

Host 코드 구성 요소 형식 CSS 높이 크기 전략 CSS 너비 크기 전략
모델 기반 앱 dataset height: "100%" width: "100%"
모델 기반 앱 field 최대 높이까지 자랄 수 있습니다.
호스팅 양식도 수용하도록 확장됩니다.
width: "100%"
모델 기반 앱 field (전체 화면 모드) height: "100%" width: "100%"
캔버스 앱 dataset & field height: allocatedWidth width: allocatedHeight
캔버스 앱 dataset ( field 전체 화면 모드) height: "100%" width: "100%"

첫 번째 값 allocatedWidthallocatedHeight 호출된 후 변경되는 경우 다음에 updateView "layout"이 추가context.updatedPropertiesupdateView 후 호출됩니다. 추가 정보: UpdatedProperties.

사용할 수 있는 대상

모델 기반 앱, 캔버스 앱 및 포털.

Syntax

context.mode.trackContainerResize(value)

매개 변수

매개 변수 이름 유형 필수 Description
value Boolean Yes True 컨트롤이 컨테이너 크기를 추적해야 하는 경우 구성 요소는 allocatedWidth 또는 allocatedHeight를 가져옵니다.

모드
Power Apps 구성 요소 프레임워크 API 참조
Power Apps 구성 요소 프레임워크 개요