レイアウトマネージャ
レイアウトマネージャ（英: Layout manager）は、ウィジェット・ツールキットで使われるソフトウェアコンポーネントであり、距離単位を使わずにウィジェット群を相対位置に基づいて配置する機能を持つ。
多くのウィジェット・ツールキットはデフォルトでこの機能を備えており、ピクセル単位などの距離単位を使って（画面全体の）絶対座標や（親ウィンドウの）相対座標で配置を定義するよりも自然な配置が可能である。この機能によって、ウィジェット・ツールキットは2種類に分類できる。
- 配置方法が特殊なグラフィックコンテナとしてコード化されているもの。XUL や .NET Framework のウィジェット・ツールキット（Windows Forms や XAML）がこれに当たる。
- 配置方法がレイアウトマネージャとしてコード化されており、それを任意のグラフィックコンテナに適用可能なもの。Java API の一部である Swing がこれに当たる。
XUL の例
[編集]vbox コンテナ上で各種コンポーネントを積み重ねることができる。
<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<window id="vbox example" title="Example"
xmlns:html="http://www.w3.org/1999/xhtml"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<vbox>
<button id="yes" label="Yes"/>
<button id="no" label="No"/>
<button id="maybe" label="Maybe"/>
</vbox>
</window>
このようなコードで3つのボタンが vertical box 内で互いに積み重なった状態となる。
Java Swing の例
[編集]FlowLayout レイアウトマネージャは、例えば文章を構成する語句のように、流れ（flow)に沿ったコンポーネント配置を行う。横幅に入るだけ水平方向にコンポーネントを（左から右へ）並べていき、いっぱいになると下に新たな行としてコンポーネントを配置していく。
import javax.swing.JFrame;
import javax.swing.JButton;
import java.awt.FlowLayout;
import java.awt.Container;
public class LayoutExample extends JFrame {
public LayoutExample() {
this.setTitle("FlowLayoutDemo");
// get the top-level container in the Frame (= Window)
Container contentPane = this.getContentPane();
// set the layout of this container
contentPane.setLayout(new FlowLayout());
// add buttons in this container
this.add((new JButton("Button 1")));
this.add((new JButton("Button 2")));
this.add((new JButton("Button 3")));
this.add((new JButton("Long-Named Button 4")));
this.add((new JButton("5")));
// unrelated, exit the application when clicking on the
// right close-button
this.setDefaultCloseOperation(JFrame.DISPOSE_ON_CLOSE);
}
public static void main(String[] args) {
LayoutExample example = new LayoutExample();
example.setVisible(true);
}
}
このコードでは、以下のように5つのボタンを同じ行に順に配置した状態となる。
XAML の例
[編集]DockPanel コンテナは、子コンポーネントをその Dock 属性に従って配置する。
<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" WindowTitle="myDock Panel">
<DockPanel>
<TextBlock DockPanel.Dock="Top">Top 1</TextBlock>
<TextBlock DockPanel.Dock="Top">Top 2</TextBlock>
<TextBlock DockPanel.Dock="Top">Top 3</TextBlock>
<TextBlock DockPanel.Dock="Top">Top 4</TextBlock>
</DockPanel>
</Page>
このコードでは、4つのテキストブロックが互いに上になるように配置される。
外部リンク
[編集]- layout tutorial on SUN website
- xul tutorial on xulplanet レイアウトについては、3章と4章
- Layout Manager Showdown on java.net
関連項目
[編集]| コマンド入力 | |
|---|---|
| データ入出力 | |
| 表示 |
|
| コンテナ | |
| ナビゲーション | |
| 特殊ウィンドウ | |
| 関連項目 | |
Text is available under the CC BY-SA 4.0 license; additional terms may apply.
Images, videos and audio are available under their respective licenses.
Cover photo is available under {{::mainImage.info.license.name || 'Unknown'}} license.
Cover photo is available under {{::mainImage.info.license.name || 'Unknown'}} license.
Credit:
(see original file).
