レイアウトを コードだけで記述 することが必要な場合があります。ダイナミックにUIを変更したいケースなどです。
2024.1.1
Button
レイアウトは他にもありますが、まずLinearLayoutのケースで基本的な設定を確認してみたいと思います。
setContentView
setContentView はその名の通り、スクリーン画面にViewを設定するメソッドです。設定されるViewはいくつかあるLayout形式の一つでまとめられたViewグループになります。
setContentView のメソッドは引数の取り方でいくつかあります
- setContentView(int layoutResID)
- レイアウトXMLファイルのIDを指定
- setContentView(View view)
- 簡略形です。今回はこれを使います
- setContentView(View view, ViewGroup.LayoutParams params)
Ref: setContentView
1. の例では activity_main.xml を設定しています
1 |
setContentView(R.layout.activity_main) |
このactivity_main.xmlの設定は静的、staticなものでアプリ起動中に簡単に変更することはできません。レイアウトを動的、dynamicに変化させたい場合は上の 2. を使います。
1 2 3 |
val layout = LinearLayout(this) ... setContentView(layout) |
LinearLayoutのケース
ButtonをタップするとTextViewの表示を変える簡単な例
これはレイアウトファイル xml で作成しました。
これをコードで書くとこのようになります。Buttonのインスタンス生成は、
1 |
val button = Button(this) |
レイアウトファイルに記述していた箇所をコードで書きますが、今回はデフォルトのConstrraintlayoutではなく昔からある LinieaLayout でやってみます。(記述が簡単なので)
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
val layout = LinearLayout(this) // orientationは垂直方向 layout.orientation = VERTICAL // Layoutの横・縦幅の指定 layout.layoutParams = LayoutParams( LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT) // 中央寄せ layout.gravity = Gravity.CENTER setContentView(layout) |
レイアウトXMLファイルを使わないので、その他にButtonやTextViewのレイアウトも設定します。
クリックリスナーは変わりません
サンプルコード
まとめるとこのようになります。
MainActivity.kt
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 |
//package com.example.kotlinbuttoncode import android.os.Bundle import android.util.TypedValue import android.view.Gravity import android.widget.Button import android.widget.LinearLayout import android.widget.LinearLayout.VERTICAL import android.widget.TextView import androidx.appcompat.app.AppCompatActivity class MainActivity : AppCompatActivity() { private var flag = false override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) //setContentView(R.layout.activity_main) // to get dp unit val dp = resources.displayMetrics.density // Instantiation of linearLayout val layout = LinearLayout(this) val mParent = LinearLayout.LayoutParams.MATCH_PARENT val wContent = LinearLayout.LayoutParams.WRAP_CONTENT layout.layoutParams = LinearLayout.LayoutParams(mParent, mParent) layout.orientation = VERTICAL layout.gravity = Gravity.CENTER // set up background color //layout.setBackgroundColor(Color.rgb(0xdf, 0xff, 0xef)) setContentView(layout) // Instantiation of TextView val textView = TextView(this) textView.text = getString(R.string.hello) textView.setTextSize(TypedValue.COMPLEX_UNIT_SP, 30f) textView.layoutParams = LinearLayout.LayoutParams(wContent, wContent) layout.addView(textView) // Instantiation of Button val button = Button(this) button.text = getString(R.string.button) val buttonLayoutParams = LinearLayout.LayoutParams( (150 * dp).toInt(), wContent ) buttonLayoutParams.topMargin = (20 * dp).toInt() button.layoutParams = buttonLayoutParams layout.addView(button) button.setOnClickListener { // flag == true if (flag) { textView.text = getString(R.string.hello) flag = false } // flag == false else { textView.text = getString(R.string.world) flag = true } } } } |
リソースファイルは必要です。
res\values\strings.xml
1 2 3 4 5 6 |
<resources> <string name="app_name">KotlinButtonCode</string> <string name="hello">Hello</string> <string name="world">World</string> <string name="button">Button</string> </resources> |
LinearLayoutはこのようにできましたが、他のレイアウトも同様にできます。
関連ページ:
Javaの場合
レイアウトファイルを使った場合
References:
LinearLayout | Android Developers
Button | Android Developers
レイアウト | Android Developers