XUL 화면에 FlowLayoutPanel 표시

개시하다
Mozilla Thunderbird(레이드버)의 추가 화면은 지금도 XUL로 기재돼 있다.NET Framework가 말한 FlowLayoutPanel(-dobon.net의 페이지)와 같은 하위 요소를 되돌릴 수 있는 용기의 코드를 공유한다.하위 요소 중 탭label을 제외하고 이미지image 등도 여러 요소를 혼합하여 사용할 수 있다.



코드
첫째: box style = "display:block;"
Box 요소는 필요에 따라 되돌려 표시할 수 있도록 수직(수직) 또는 수평(수평) 방향으로 하위 요소를 배열할 수 있습니다.
sample.xul

<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/global.css" type="text/css"?>

<dialog id="sample"
    xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
    title="サンプル"
>

<box style="display:block;">
    <label value="とんかつソース" />
    <label value="サラミ" />
    <label value="チーズ" />
    <label value="とんかつソース" />
    <label value="やさいサラダ" />
    <label value="テリヤキバーガー" />
    <label value="めんたい" />
    <label value="たこ焼" />
    <label value="コーンポタージュ" />
    <label value="なっとう" />
    <label value="チョコレート" />
</box>

</dialog>

둘째: description
Description 원소도 가로(수평)로 하위 원소를 배열하고 필요에 따라 되돌려 표시할 수 있다.
sample.xul

<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/global.css" type="text/css"?>

<dialog id="sample"
    xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
    title="サンプル"
>

<description>
    <label value="とんかつソース" />
    <label value="サラミ" />
    <label value="チーズ" />
    <label value="とんかつソース" />
    <label value="やさいサラダ" />
    <label value="テリヤキバーガー" />
    <label value="めんたい" />
    <label value="たこ焼" />
    <label value="コーンポタージュ" />
    <label value="なっとう" />
    <label value="チョコレート" />
</description>

</dialog>

참고 자료

How to achieve flow layout in XUL? - Sack Over Flow 본문은 거의 모두 이곳의 일본어 버전 소개 문장