説明
レイアウト・ソリューションは、アプリケーション・プロジェクトに追加され、この点で、XMLとEclipse ADTインターフェイスは、作業の強力なアシスタントになります - しかし、次の2つのセクションでは、Java開発の知識の一部も使用します。もし、まだこの2つの基本的な理解が不足しているのであれば、できるだけ早くそれを補う方法を見つけてください。これから開発を始める読者にとって、この記事で紹介したことは今後の開発作業の重要な基礎となるでしょう。
1.XMLの基本
レイアウトについて説明する前に、マークアップ言語としてのXMLの基本について説明します。XMLはデータ値を格納するための言語です。XMLファイルは多くの分野で機能します。XMLファイルは多くの分野で機能し、プロジェクトによってはデータベースと非常によく似た機能を持ち、Webページの出力メカニズムとしてよく使用されます。HTMLを扱ったことがあれば、XMLの基本的な機能には慣れているはずです。
XMLでは、データの値は要素に格納されます。1つの要素には通常、以下のように開始タグと終了タグが含まれます：
<product>Onion</product>
ご覧のとおり、開始タグと終了タグはほとんど同じですが、唯一異なるのは、終了タグに「/」記号が追加されていることです。上記の例では、データ値は要素の内容、すなわちテキスト文字列「Onion」でもあります。開始タグは、以下のように、データ項目に関連すると考えられる他の属性情報を保持することもできます：
<product type="vegetable">Onion</product>
各属性は名前と値を持ち、値はカンマで囲まれた部分です。要素は他の要素を含むこともできます：
<section name="food"><font></font>
<product type="vegetable">Onion</product><font></font>
<product type="fruit">Banana</product><font></font>
</section><font></font>
この構造では、セクション要素を主要素、商品要素を子要素と呼びます。2つの子要素は互いに「兄弟」です。XML文書では、主要素となるルート要素がなければなりません。これにより木構造が形成され、子要素は主要素の枝となります。子要素がその下に他の子要素を含む場合、その子要素も主要素の属性を持ちます。
また、開始マーカーと終了マーカーが独立していない、別のタイプの自己終端要素もあります：
<order number="12345" customerID="a4d45s"/>
要素の末尾の"/"記号は終了を表します。
XMLマークアップは、レイアウトファイル、描画可能要素、データ値、マニフェストなど、Androidプラットフォームで使用されるすべてのリソースファイルに使用されます。
2.アンドロイドのレイアウト
初期段階
ADTをインストールしたEclipse IDEでXMLを扱う場合、入力中に表示されるバックグラウンド・プロンプトを使用すると、コーディング作業が少し楽になります。新しいアプリケーションのメインレイアウトファイルをエディターで開き、XML編集タブが選択されていることを確認して、コードを直接編集できるようにします。Eclipseはパーソナライズのための基本的なレイアウトのセットを提供します：
<RelativeLayout xmlns:android="http://..com/apk/res/android"<font></font>
xmlns:tools="http://..com/tools"<font></font>
android:layout_width="match_parent"<font></font>
android:layout_height="match_parent"<font></font>
android:paddingBottom="@dimen/activity_vertical_margin"<font></font>
android:paddingLeft="@dimen/activity_horizontal_margin"<font></font>
android:paddingRight="@dimen/activity_horizontal_margin"<font></font>
android:paddingTop="@dimen/activity_vertical_margin"<font></font>
tools:context=".MainActivity" ><font></font>
<TextView<font></font>
android:layout_width="wrap_content"<font></font>
android:layout_height="wrap_content"<font></font>
android:text="@string/hello_world" /><font></font>
</RelativeLayout><font></font>
ご覧のように、ルート要素はレイアウト要素で、上の例の場合はRelativeLayoutです。Androidでは他にもいくつかのタイプのレイアウトが利用可能で、レイアウトを別のレイアウトの中に入れ子にすることができます。ここでのルートレイアウト要素には、width、height、marginなど、レイアウト効果に密接に関連するプロパティがいくつか追加されています。アプリケーションのUIを形成する可視的でインタラクティブな要素であるViewの一種であるため、アプリケーションの各分割画面シナリオはViewを選択し、その中に1つ以上のレイアウトメカニズムを含みます。Androidでは、これらのレイアウトはViewGroupオブジェクトと呼ばれ、各ViewGroupは1つ以上のViewのセットを含んでいます。
だんかい
レイアウトセットの基本的な作成に集中するためには、メインのレイアウトファイルから既存のコンテンツをすべて削除して、ゼロからデザインを始めることが重要です。前述のように、Java コードを使用して独自のレイアウトや View を作成することもできますが、Android には、開発者が XML を使用してアプリの UI を設計できるさまざまなツールがあります。場合によっては、UI の一部または全部が Java コードだけで作成されているのを見たことがあるかもしれませんが、実際にはほとんどの作成が XML で行われています。このアプローチでは、アプリケーション・ロジックが表示要素から独立していることも保証されます。
<LinearLayout xmlns:android="http://..com/apk/res/android"<font></font>
android:layout_width="fill_parent"<font></font>
android:layout_height="fill_parent"<font></font>
android:orientation="vertical" ><font></font>
<!-- views go here --><font></font>
</LinearLayout><font></font>
LinearLayout は、意図した View を横向きまたは縦向きに表示します。上記の例では、表示方向が縦なので、各 View は画面の下部に沿って順番に配置されます。上記の例では、表示方向が垂直なので、各Viewは画面の下部に沿って整列します。 レイアウトが水平の場合、各Viewは左から右に整列します。layout width "と "layout height "プロパティを使用すると、レイアウトは水平方向と垂直方向の最大長さに引き伸ばされます。
layout height "宣言行の後に新しい行を追加し、"android: "と入力してプロパティの入力を始める準備をします。対応する内容を入力すると、Eclipseはリストに関連するプロパティのセットを提供します。属性のリストを絞り込むために入力を続けることもできますし、リストを直接ポイント＆クリックすることもできます。ここで、"android: gravity "プロパティを選択します。
重心の値として "center_horizontal "を入力すると、そこに含まれる要素がX軸の中心に表示されます：
android:gravity="center_horizontal"
この方法は、レイアウト内のすべての要素に適用されます。他にも、パディングやマージン、背景など、いくつかの表示プロパティを追加することができます。しかし、今日の記事では、最も単純な項目から始めましょう。
3.ビューの追加
初期段階
積極的に、UI の目に見える要素である Views をレイアウトに追加し始めます。まずはテキストとボタンを追加してみましょう。LinearLayout要素に入り、"<"と入力すると、Eclipseがその属性に関連付けられた利用可能な要素のリストを表示します。
ほとんどのViewと同様に、これは自己終了要素であることに注意してください。TextViewにレイアウト幅とレイアウト高さの2つのプロパティを設定します：
<TextView<font></font>
android:layout_width="wrap_content"<font></font>
android:layout_height="wrap_content" /><font></font>
wrap_content "を使用すると、Viewの幅が表示するコンテンツを収容するのに十分広いことを確認できます。次に、TextViewに別のプロパティを追加し、今度はテキスト文字列を列挙して表示を有効にします：
android:text="Hello there"
ファイルを保存すると、Eclipse に警告メッセージが表示されます。メッセージの上にマウスカーソルを置くと、エディターの境界線にテキストが表示されます。警告には「Hardcoded string......should use @string resource（ハードコードされた文字列......@stringリソースを使用する必要があります）」とあります。推奨される方法は、各テキスト文字列の値をレイアウトXMLに直接含めるのではなく、valueリソースとして保存することです。を直接レイアウトXMLに含めることです。最初は面倒で無意味に思えるかもしれませんが、一度この習慣を身につければ、将来的に大規模なプロジェクトでその価値が分かるようになるでしょう。パッケージ・エクスプローラーで "res/values/strings.xml "というファイルを見つけて開き、"strings.xml "タブに切り替えてコードを編集してください。
ご覧のように、Eclipseにはすでにいくつかの文字列が追加されています。別の文字列を追加するには、名前と値を設定するだけです：
<string name="hello">Hello there</string>
つまり、アプリケーションのUIで同じ文字列を複数回使用する必要があり、後で変更する必要がある場合、1カ所で変更できるようになります。文字列ファイルを保存し、レイアウトファイルに切り替えます。TextViewの "text "プロパティをvalueファイルの対応する文字列に参照します：
android:text="@string/hello"
文字列名の前に"@string "を付けて、文字列リソースを探す場所をAndroidツールに知らせます。このようにすると、警告メッセージが表示されなくなります。Eclipseは通常、コーディング中にこのような警告を発行し、現在のエラーや警告の問題を通知します。警告メッセージの内容に従うか無視するかは選択できますが、エラーを調整しなければなりません。
だんかい
TextViewの後にButtonを追加します：
<Button<font></font>
android:layout_width="wrap_content"<font></font>
android:layout_height="wrap_content"<font></font>
android:text="@string/click" /><font></font>
この例では、ButtonはTextViewと同じプロパティを使用します。しかし、他のケースでは、より多くのプロパティを使用することがあり、一般的に、異なるビューは、異なるプロパティを扱う必要があります。text "プロパティの値は、ボタンに表示されます。同じ文字列をファイル "res/values/strings.xml "に追加します：
<string name="click">Click Me!</string>
次のチュートリアルでは、ボタンのクリック効果を扱います。レイアウトファイルに切り替え、エディタの右側にあるアウトラインビューを見てください。リストされた項目をダブルクリックすると、対応するコードの場所にジャンプします。また、主要な要素を展開したり折りたたんだりすることもできます。レイアウトが複雑になると、この操作が非常に便利になります。
ヒント：Eclipseエディターで開いているすべてのファイルを整理するには、単に "Ctrl + A "を押して、それらをすべて選択し、 "Ctrl + I "を押すことができます。
4.グラフィカルなレイアウト
初期段階
レイアウトファイルが正しく保存されていることを確認し、グラフィカルレイアウトタブに切り替えます。
デザインしたレイアウトはすでに直接見ることができることがわかります。インターフェースの左側にあるパレットエリアでは、UIアイテムを選択してレイアウトにドラッグすることができます。XMLはデザインの細部をコントロールするのに役立ちますので、グラフィカルツールを使用している場合でもXMLの結果を編集する必要があるかもしれません。
グラフィカル・レイアウト・ビューの上にはドロップダウンリストがあり、レイアウトの効果を表示するデバイスの種類を選択できます。レイアウトをデザインする際には、グラフィカル・レイアウトを使って効果をコントロールする必要があります。その他にも、試してみる価値のあるレイアウト要素や設定がいくつかあります。
だんかい
このレイアウトでは、表示されている要素が画面の上端に寄って表示されていることにお気づきかもしれません。これを修正する方法は次のとおりです。XML Editタブに切り替え、LinearLayoutにMarginプロパティを追加します：
android:layout_margin="10dp"
dp "を使用してピクセル密度を個別に設定すると、ユーザーのデバイスに自動的にピクセル密度が合うようにデザインされます。ファイルを保存し、グラフィカルレイアウトに切り替えると、実際の結果が表示されます。
5.オプション
アプリケーション画面に含めることができるレイアウトやビューにはさまざまな種類がありますが、基本的なアプローチは同じです。前節ではLinearLayoutを使用しましたが、他にもRelativeLayout、FrameLayout、AbsoluteLayout、GridLayoutなど多くのオプションがあり、LinearLayoutパレットで見つけることができます。リラックスして、ビューでどれかを選択し、その表示を観察することをお勧めします。グラフィカルレイアウトツールから要素を追加する場合は、必ずXMLに切り替えて、新しい要素の追加によってどのようなマークアップコードが生成されるかを確認してください。
Android プラットフォームには、ラジオボタン、チェックボックス、テキスト入力エリアなど、さまざまな一般的なニーズに対応する View ソリューションが用意されています。しかし、付属していないUI要素を使用する必要がある場合は、カスタムViewクラスを作成する必要があります。一般的に、標準化された UI 要素はユーザーのデバイス上でより信頼性が高く、開発とテストの時間を節約できるため、これは他に選択肢がない場合に行うのが最善です。
はんけつをくだす
http://...///----gn/
