X/Y 맞추기를 사용하여 컴포넌트 맞추기

컴포넌트의 레이아웃 특성을 널(null)로 설정하면 사용자 정의 레이아웃 창을 사용하여 해당 경계에 맞게 컴포넌트를 배열할 수 있습니다.

레이아웃이 널(null)로 설정된 각 컴포넌트는 해당 경계를 기준으로 사용자 인터페이스에서 독립적으로 배치되고 크기 조정됩니다. 각 컴포넌트의 경계를 개별적으로 갱신하는 산만하고 오류가 발생할 수 있는 타스크를 피하려면 Visual Editor를 사용하여 갱신사항 관계를 기반으로 컴포넌트의 크기 및 배치를 맞추고 조정하면 됩니다.

레이아웃을 널(null)로 설정하면 레이아웃 사용자 정의 창에는 컴포넌트 그룹에서 작업하는 다양한 조치가 포함됩니다. 다음을 수행할 수 있습니다.
  • 에지 기준으로 컴포넌트 맞추기
  • 중심점 기준으로 컴포넌트 맞추기
  • 컴포넌트의 너비 및 높이 동일하게 작성
  • 컴포넌트를 지정된 공간에 가로 및 세로로 균일하게 분배

컴포넌트를 널(null) 레이아웃에 맞추고 크기 조정하고 분배하려면 다음을 수행하십시오.

  1. 디자인 보기 또는 Java Bean 보기에서 서로에 대해 맞추거나 조정하려는 둘 이상의 컴포넌트를 선택하십시오. 선택 범위 선택 도구를 사용하거나 Ctrl 키를 눌러 여러 개의 컴포넌트를 선택할 수 있습니다. 선택한 마지막 컴포넌트는 제어 컴포넌트이거나 앵커입니다. 앵커 컴포넌트는 검은색 크기 조정 핸들로 표시되지만 다른 선택 컴포넌트는 흰색 핸들을 갖습니다.
  2. 레이아웃 사용자 정의 창을 열려면 다음 단계 중 하나를 수행하십시오.
    • 마우스 오른쪽 단추를 클릭한 후 팝업 메뉴에서 레이아웃 사용자 정의를 선택하십시오.
    • 도구 모음에서 레이아웃 사용자 정의 레이아웃 사용자 정의 도구 모음 단추를 클릭하십시오.

    널(null) 레이아웃용 레이아웃 사용자 정의 창

  3. 서로를 기준으로 컴포넌트를 맞추려면 다음 단추를 사용하십시오.
    • 왼쪽 맞추기 - 앵커 컴포넌트의 왼쪽 에지에 컴포넌트를 맞춥니다.
    • 가운데 맞추기 - 세로 면에 따라 앵커 컴포넌트의 가운데에 컴포넌트를 맞춥니다.
    • 오른쪽 맞추기 - 앵커 컴포넌트의 오른쪽 에지에 컴포넌트를 맞춥니다.
    • 맨 위 맞추기 - 앵커 컴포넌트의 맨 위 에지에 컴포넌트를 맞춥니다.
    • 중간 맞추기 - 가로 면에 따라 앵커 컴포넌트의 중간에 컴포넌트를 맞춥니다.
    • 맨 아래 맞추기 - 앵커 컴포넌트의 맨 아래 에지에 컴포넌트를 맞춥니다.
  4. 선택된 컴포넌트의 크기를 조정하려면 다음 단추를 사용하십시오.
    • 너비 일치 - 컴포넌트 너비를 앵커 컴포넌트 너비와 같게 만듭니다.
    • 높이 일치 - 컴포넌트 높이를 앵커 컴포넌트 높이와 같게 만듭니다.
  5. 컴포넌트 간격을 분배하려면 우선 다음 중 하나를 수행하여 분배 영역의 경계를 지정하십시오.
    • 컨테이너를 분배 영역으로 사용하려면(기본 동작) 아무 것도 클릭하지 않거나 상자가 이미 표시되어 있으면 분배 상자 숨기기를 클릭하십시오.
    • 분배 상자 표시를 클릭하고 상자의 핸들을 끌어서 분배에 필요한 크기를 작성하십시오.
    그런 후 다음 단추 중 하나를 사용하여 컴포넌트를 분배하십시오.
    • 가로 분배 - 컴포넌트 너비를 앵커 컴포넌트 너비와 같게 만듭니다.
    • 세로 분배 - 컴포넌트 높이를 앵커 컴포넌트 높이와 같게 만듭니다.

예를 들어, 세 개의 JButton 컴포넌트를 선택하여 너비를 같게 하고 왼쪽 경계에서 서로 맞추도록 지정할 수 있습니다. 마지막으로 선택된 JButton 컴포넌트는 다른 두 개의 단추에 대해 앵커 또는 제어로 사용됩니다. 왼쪽 맞추기 조치는 JButton 컴포넌트를 마지막으로 선택된 JButton 컴포넌트의 왼쪽 에지에 맞추고 너비 일치 조치는 선택된 JButton 컴포넌트의 너비를 제어 JButton 컴포넌트의 너비와 같게 만듭니다.

레이아웃 사용자 정의 창의 맞추기 단추는 다음 조건이 만족된 경우에만 사용됩니다.

컴포넌트를 맞추고 너비 및 높이를 일치시킬 뿐 아니라 컴포넌트를 분배할 수 있습니다. 컴포넌트를 분배하면 컴포넌트는 상위 컨테이너가 정의한 경계 상자 내에서 균일한 간격이 되도록 위치가 변경됩니다. 예를 들어, 세로 분배 단추 세로 분배 단추를 클릭하기 전에 세 개의 단추는 다음 이미지와 같이 간격이 균일하지 않습니다.


디자인 보기에 배치된 Bean

세로 분배를 클릭한 후 컴포넌트 간격은 다음 이미지와 같이 균일하게 됩니다.

세로로 분배된 Bean

세 개의 단추는 상위의 높이 내(프레임의 맨 위 및 맨 아래 에지)에서 분배됩니다.

분배에 사용되는 영역을 좀 더 제어하려면 분배 상자 표시 분배 상자 단추를 클릭하여 분배 상자를 사용하면 됩니다. 이 단추를 클릭하면 선택된 모든 컴포넌트의 영역 주위에 상자가 그려집니다. 해당 핸들을 사용하여 이 상자를 이동하고 크기 조정할 수 있습니다. 분배 상자를 사용하고 상자가 활성 상태이면 분배 상자는 제어의 위치를 조정하는 데 사용되는 영역을 정의합니다. 분배 상자를 사용하지 않으면 상위 컨테이너가 분배에 사용되는 영역을 정의합니다. 다음 이미지는 분배 상자를 표시합니다.

분배 상자를 사용한 Bean

다음 이미지에 표시된 대로 분배 상자를 이동하고 크기 조정할 수 있습니다.

크기 조정된 분배 상자의 Bean

분배 상자를 사용하면서 세로 분배를 수행하면 다음 이미지와 같이 상위 컨테이너가 아니라 상자 경계 내에서 분배가 이루어집니다.

상자 내에서 세로로 분배된 Bean

(C) Copyright IBM Corporation 1999, 2004. All Rights Reserved.