問題
Flutterで端末の画面サイズに応じて、画面最下部に広告表示エリアを作成し、
そこに画面サイズに応じた広告を貼り付けています。
しかし、TextFieldで入力して数値入力キーボードを呼び出すと、広告の上にキーボードが被さってしまいます。
広告に被らずに、広告の上の領域に数値入力キーボードを表示させる方法があればご教示ください。
スクショ
↓
dart
1import 'package:flutter/material.dart'; 2import 'package:flutter/services.dart'; 3import 'dart:async'; 4import 'dart:math'; 5import 'package:flutter/services.dart' show rootBundle; 6import 'dart:convert'; 7import 'dart:io'; 8import 'package:firebase_admob/firebase_admob.dart'; 9import 'package:salt/pages/history/history_page.dart'; 10 11class HomePage extends StatefulWidget { 12 HomePage({Key key, this.title}) : super(key: key); 13 14 final String title; 15 16 17 _HomePageState createState() => _HomePageState(); 18} 19 20class _HomePageState extends State<HomePage> { 21 22 23 void initState() { 24 super.initState(); 25 // インスタンスを初期化(自分のアプリIDを挿入:今回はテスト用のアプリIDを利用) 26 //FirebaseAdMob.instance.initialize(appId: 'APPID'); 27 FirebaseAdMob.instance.initialize(appId: getAppId()); 28 // バナー広告を表示する 29 myBanner 30 ..load() 31 ..show( 32 // ボトムからのオフセットで表示位置を決定 33 anchorOffset: 0.0, 34 anchorType: AnchorType.bottom, 35 ); 36 } 37 38 // テキストフィールドを管理するコントローラを作成(入力内容の取得用) 39 final textController = TextEditingController(); 40 41 42 // 入力データ格納用のリスト 43 List<Map<String, dynamic>> items = []; 44 45 // 追加ボタンが押されたときの処理(リストにIDと入力データを新規追加) 46 void _addItem(String inputText) { 47 setState(() { 48 items.add({"A": nputText, "B": inputText); 49 }); 50 } 51 52 53 // widgetの破棄時にコントローラも破棄 54 void dispose() { 55 textController.dispose(); 56 super.dispose(); 57 } 58 59 60 Widget build(BuildContext context) { 61 // 画面サイズを取得(幅、高) 62 final Size screenSize = MediaQuery.of(context).size; 63 // バナー広告の高さ 64 double adBannerHeight = 50; 65 // 画面の高さ(dp)によって表示広告(スマートバナー)の高さをセット 66 if (screenSize.height > 720) { 67 adBannerHeight = 90.0; 68 } else if (screenSize.height > 400) { 69 adBannerHeight = 50.0; 70 } else { 71 adBannerHeight = 32.0; 72 } 73 74 return Column(children: <Widget>[ 75 Expanded( 76 child: Scaffold( 77 appBar: AppBar( 78 title: Text("TEST", style: TextStyle(color: Colors.white)), 79 ), 80 body: new GestureDetector( 81 child: new Container( 82 child: Column(children: [ 83 Padding( 84 padding: const EdgeInsets.all(10.0), 85 child: TextField( 86 controller: textController, 87 keyboardType: TextInputType.number, 88 style: TextStyle( 89 color: Colors.blueAccent, 90 fontSize: 25.0, 91 fontWeight: FontWeight.w500), 92 // キーボードは数値のみ 93 // フォームの装飾を定義 94 decoration: InputDecoration( 95 hintText: '例(10)', 96 icon: Icon(Icons.person_outline), 97 fillColor: Colors.white, 98 ), 99 onEditingComplete: () { 100 _addItem(textController.text); 101 }, 102 ), 103 ), 104 105 // ナビゲーションバーの下の空白 106 Container( 107 //color: Colors.black, 108 width: double.infinity, 109 height: adBannerHeight + 5, 110 ), 111 ]), 112 ), 113 ), 114 ), 115 ), 116 ]); 117 } 118} 119 120// 広告ターゲット 121MobileAdTargetingInfo targetingInfo = MobileAdTargetingInfo( 122 keywords: <String>['flutterio', 'beautiful apps'], 123 contentUrl: 'https://flutter.io', 124 birthday: DateTime.now(), 125 childDirected: false, 126 designedForFamilies: false, 127 gender: MobileAdGender.male, 128 // or female, unknown 129 testDevices: <String>[], // Android emulators are considered test devices 130); 131 132BannerAd myBanner = BannerAd( 133 // 広告ユニットID(テスト用のIDを使用、本番は自分の広告ユニットIDを利用) 134 adUnitId: getBannerAdUnitId(), 135 size: AdSize.smartBanner, 136 targetingInfo: targetingInfo, 137 listener: (MobileAdEvent event) { 138 // 広告の読み込みが完了 139 print("BannerAd event is $event"); 140 }, 141); 142 143String getAppId() { 144 if (Platform.isIOS) { 145 return 'AD-ID'; 146 } else if (Platform.isAndroid) { 147 return 'AD-ID'; 148 } else { 149 return 'AD-ID'; 150 } 151 return null; 152} 153 154String getBannerAdUnitId() { 155 if (Platform.isIOS) { 156 return 'AD-ID'; 157 } else if (Platform.isAndroid) { 158 return 'AD-ID'; 159 } else { 160 return 'AD-ID'; 161 } 162 return null; 163}
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。