LoginSignup
47
49

More than 5 years have passed since last update.

[android]xmlで枠を指定する

Posted at

はじめに

    javaの基本的な理解はできている
    androidStudioの導入が完了している
同じく、開発初心者による備忘録のような形になります。
Day1.AndroidStudioにおけるプロジェクトの作り方
Day2.Androidアプリケーションの構成
Day3.アプリケーションのレイアウト
Day4.onClickListenerの実装とその後の処理
Day5.Activityのライフサイクル

枠線をxmlで描く

viewの外周に枠線を描きたい場合.xmlで枠線を描画してそれをViewのstateでbackGroundに指定する方法があります。

まずは基本的な枠線から

.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <stroke android:width="3dp"
        android:color="@color/COLOR_RED"/>
</shape>

一行目のxmlns:android="http://schemas.android.com/apk/res/android"
ですがこれはandroidLayout用の定義であることを明確にする識別子です。
ルート要素には必ず指定する必要があります。
二行目のについてです。
この中に線の状態を定義しています。
見た通りですが 線の太さを3dpに、colorはcolor.xmlに定義されたCOLOR_REDを表示するといったものです。

.xml
<LinearLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:background="@drawable/test">
</LinearLayout>

こういった具合に指定します。

では詳しく説明していきます。
xmlのstateの指定はほかにも

  • gradient
  • padding
  • size
  • solid
  • stroke
  • corners

など存在します。今までに私が使用したことがあるのが上記で他にもあるのかもしれませんが困ってないので省きます。(そもそも存在しない可能性もあります。未確認です申し訳ありません。)

gradient

グラデーションを指定します。

xml
   <gradient
        android:angle="100"
        android:startColor="@color/COLOR_BLACK"
        android:centerColor="@color/COLOR_WHITE"
        android:endColor="@color/COLOR_RED"
        android:type="sweep"/>

センスの悪いグラデーションが表示されると思います。
angleはグラデーションのカラーを指定します。
start-center-endは色を指定することである色からある色へ移り変わります。
centerは指定しなくても大丈夫です。3点変更させる場合は必要になります。
typeは3つステータスが存在します。

  • liner
  • radial
  • sweep

です。それぞれ用途に合ったものを使用してください。

padding

xmlの中に空白を作り出します。
今回の場合枠線ですのでpaddingを指定する必要があります。
枠線を太くするとわかりますが枠線と中のViewの要素がかぶってしまうからです。
注意する点はxmlそのものの見た目にpaddingができるわけではないという点です。
もう一点、viewのようにandroid:padding=""は使えません。top,bottom,left,rightそれぞれ指定する必要があります。

.xml
    <padding
        android:top="10dp">
    </padding>

Size

xmlの大きさを指定します。

.xml
<size
        android:width="@dimen/xmlSize"
        android:height="@dimen/xmlSize"/>

詳しく説明する必要はないと思いますので高さと幅を指定しています。
dimenに記述してそれを参照しています。

solid

背景色を指定します。

.xml
<solid
        android:color="@color/COLOR_RED"/>

今回はredを指定しましたが普通は透明にするでしょうね。
ちなみに透明のcolorCodeは"#00ffffff"です。
修正で泣きを見るのは開発者ですしcolor.xmlにしっかり記述しておきましょう。

stroke

上でも説明していますが線の要素を変えます。

.xml
<stroke android:width="3dp"
        android:color="@color/COLOR_RED"/>

太さと色を指定しています。

corners

cornersはそのlayoutの角を丸める際に使います

xml
    <corners
        android:radius="100dp"
        android:topLeftRadius="100dp"
        android:topRightRadius="100dp"
        android:bottomLeftRadius="100dp"
        android:bottomRightRadius="100dp"/>

極端に丸めていますが以上です。
こちらはpaddingと違い全体をまとめて android:radius=""で丸めることができます。

一定の方向にだけ枠を付ける

実は簡単に枠を一部につけることはできません。
加筆予定

47
49
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
47
49