스타일링 함수
이 문서에서는 Flex Panels에 제공되는 모든 스타일링 함수에 대해 설명합니다. 모든 스타일링 속성에 대한 일반 정보는 Flex Panel Struct Members를 참조하세요.
설정자 (Setters)
다음은 Flex Panel의 스타일을 설정하는 함수 목록입니다:
| 함수 이름 | 설명 |
|---|---|
flexpanel_node_style_set_width |
너비 설정 |
flexpanel_node_style_set_height |
높이 설정 |
flexpanel_node_style_set_min_width |
최소 너비 설정 |
flexpanel_node_style_set_max_width |
최대 너비 설정 |
flexpanel_node_style_set_min_height |
최소 높이 설정 |
flexpanel_node_style_set_max_height |
최대 높이 설정 |
flexpanel_node_style_set_aspect_ratio |
종횡비 설정 |
flexpanel_node_style_set_position |
위치 설정 |
flexpanel_node_style_set_position_type |
위치 유형 설정 |
flexpanel_node_style_set_margin |
여백 설정 |
flexpanel_node_style_set_padding |
패딩 설정 |
flexpanel_node_style_set_border |
테두리 설정 |
flexpanel_node_style_set_gap |
간격 설정 |
flexpanel_node_style_set_direction |
방향 설정 |
flexpanel_node_style_set_flex_direction |
플렉스 방향 설정 |
flexpanel_node_style_set_flex_wrap |
플렉스 래핑 설정 |
flexpanel_node_style_set_flex_basis |
플렉스 기준 설정 |
flexpanel_node_style_set_flex_grow |
플렉스 성장 설정 |
flexpanel_node_style_set_flex_shrink |
플렉스 축소 설정 |
flexpanel_node_style_set_flex |
플렉스 설정 |
flexpanel_node_style_set_justify_content |
콘텐츠 정렬 설정 |
flexpanel_node_style_set_align_items |
아이템 정렬 설정 |
flexpanel_node_style_set_align_self |
자기 정렬 설정 |
flexpanel_node_style_set_align_content |
콘텐츠 정렬 설정 |
flexpanel_node_style_set_display |
표시 설정 |
접근자 (Getters)
다음은 Flex Panel의 스타일을 가져오는 함수 목록입니다:
| 함수 이름 | 설명 |
|---|---|
flexpanel_node_style_get_width |
너비 가져오기 |
flexpanel_node_style_get_height |
높이 가져오기 |
flexpanel_node_style_get_min_width |
최소 너비 가져오기 |
flexpanel_node_style_get_max_width |
최대 너비 가져오기 |
flexpanel_node_style_get_min_height |
최소 높이 가져오기 |
flexpanel_node_style_get_max_height |
최대 높이 가져오기 |
flexpanel_node_style_get_aspect_ratio |
종횡비 가져오기 |
flexpanel_node_style_get_position |
위치 가져오기 |
flexpanel_node_style_get_position_type |
위치 유형 가져오기 |
flexpanel_node_style_get_margin |
여백 가져오기 |
flexpanel_node_style_get_padding |
패딩 가져오기 |
flexpanel_node_style_get_border |
테두리 가져오기 |
flexpanel_node_style_get_gap |
간격 가져오기 |
flexpanel_node_style_get_direction |
방향 가져오기 |
flexpanel_node_style_get_flex_direction |
플렉스 방향 가져오기 |
flexpanel_node_style_get_flex_wrap |
플렉스 래핑 가져오기 |
flexpanel_node_style_get_flex_basis |
플렉스 기준 가져오기 |
flexpanel_node_style_get_flex_grow |
플렉스 성장 가져오기 |
flexpanel_node_style_get_flex_shrink |
플렉스 축소 가져오기 |
flexpanel_node_style_get_flex |
플렉스 가져오기 |
flexpanel_node_style_get_justify_content |
콘텐츠 정렬 가져오기 |
flexpanel_node_style_get_align_items |
아이템 정렬 가져오기 |
flexpanel_node_style_get_align_self |
자기 정렬 가져오기 |
flexpanel_node_style_get_align_content |
콘텐츠 정렬 가져오기 |
flexpanel_node_style_get_display |
표시 가져오기 |
단위 (Units)
일부 속성은 절대 픽셀 값 또는 백분율 값을 가질 수 있습니다. 설정자 함수인 flexpanel_node_style_set_width와 같은 함수에서는 다음 열거형 멤버 중 하나를 사용하여 값과 함께 단위를 지정할 수 있습니다:
| 상수 | 설명 |
|---|---|
flexpanel_unit.point |
값을 픽셀 수로 해석 |
flexpanel_unit.percent |
값을 백분율로 해석 |
flexpanel_unit.auto |
지원되는 속성에 대해 자동 크기 조정 사용 |
이러한 속성에 대한 접근자 함수인 flexpanel_node_style_get_width는 두 개의 멤버를 가진 구조체를 반환합니다:
| 멤버 | 데이터 유형 | 설명 |
|---|---|---|
unit |
Flex Panel Unit Constant | 값의 단위, 위의 표에 있는 열거형 멤버 중 하나 |
value |
Real | 값 자체 |
활용 예제
다음은 Flex Panel의 스타일링 함수를 활용하는 몇 가지 예제입니다:
// Flex Panel의 너비와 높이를 설정하는 예제
flexpanel_node_style_set_width(panel, 300);
flexpanel_node_style_set_height(panel, 200);
// Flex Panel의 여백과 패딩을 설정하는 예제
flexpanel_node_style_set_margin(panel, 10);
flexpanel_node_style_set_padding(panel, 5);
// Flex Panel의 플렉스 방향과 정렬을 설정하는 예제
flexpanel_node_style_set_flex_direction(panel, flexpanel_direction_row);
flexpanel_node_style_set_justify_content(panel, flexpanel_justify_center);
// Flex Panel의 최소 및 최대 크기를 설정하는 예제
flexpanel_node_style_set_min_width(panel, 100);
flexpanel_node_style_set_max_width(panel, 500);
// Flex Panel의 테두리와 간격을 설정하는 예제
flexpanel_node_style_set_border(panel, 2);
flexpanel_node_style_set_gap(panel, 15);
// Flex Panel의 위치와 종횡비를 설정하는 예제
flexpanel_node_style_set_position(panel, flexpanel_position_absolute);
flexpanel_node_style_set_aspect_ratio(panel, 16.0 / 9.0);