Flutterでnend広告を実装する

nend公式にはFlutterでの実装方法が書いてなくて苦労したので、ここにやり方を残しておきます。

 

①Gradleの設定

以下ソースをrepositoriesに追加します。

※これは公式通りですが、2か所に登録しなきゃいけないとかどうとか・・

maven {
// nendSDK
url 'https://fan-adn.github.io/nendSDK-Android-lib/library'
}

 

dependenciesにも追加します。

dependencies {
implementation 'net.nend.android:nend-sdk:8.1.0'
}

 

■build.gradle(プロジェクトレベル)

buildscript {
ext.kotlin_version = '1.3.50'
repositories {
google()
mavenCentral()
maven {
// nendSDK
url 'https://fan-adn.github.io/nendSDK-Android-lib/library'
}
}

dependencies {
classpath 'com.android.tools.build:gradle:4.1.0'
classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlin_version"
}
}

allprojects {
repositories {
google()
mavenCentral()
maven {
// nendSDK
url 'https://fan-adn.github.io/nendSDK-Android-lib/library'
}
}
}

 

■build.gradle(アプリレベル)

dependencies {
implementation "org.jetbrains.kotlin:kotlin-stdlib-jdk7:$kotlin_version"
implementation 'net.nend.android:nend-sdk:8.1.0'
}

 

github.com

 

 

プラグインの追加

以下コマンドを実行すると「nend_plugin:^バージョン」が追加されます。

flutter pub add nend_plugin

 

■pubspec.yaml

dependencies:
nend_plugin: ^1.0.1

pub.dev

 

③「minSdkVersion」を21に変更。※古いバージョンだとエラーが出る・・

 

■build.gradle(アプリレベル)

defaultConfig {
applicationId "com.example.koukokutest"
minSdkVersion 21
targetSdkVersion flutter.targetSdkVersion
versionCode flutterVersionCode.toInteger()
versionName flutterVersionName
}

 

④nend.dartを作ります。

import 'dart:developer';
import 'package:flutter/material.dart';
import 'package:nend_plugin/nend_plugin.dart';

//テスト用バナー広告ID
int spotId = 3174;
String apiKey = "c5cb8bc474345961c6e7a9778c947957ed8e1e4f";

//広告
class KoukokuNend extends StatefulWidget {
const KoukokuNend({Key? key}) : super(key: key);

@override
_KoukokuNend createState() => _KoukokuNend();
}

class _KoukokuNend extends State<KoukokuNend> {
late BannerAdController adController;

@override
Widget build(BuildContext context) {
return BannerAd(
bannerSize: BannerSize.type320x50,
listener: _eventListener(),
onCreated: (controller) {
adController = controller;
adController.load(spotId: spotId, apiKey: apiKey);
adController.show();
},
);
}

BannerAdListener _eventListener() {
return BannerAdListener(
onLoaded: () => log('onLoaded'),
onReceiveAd: () => log('onReceived'),
onFailedToLoad: () => log('onFailedToLoad'),
onAdClicked: () => log('onAdClicked'),
onInformationClicked: () => log('onInformationClicked'),
);
}
}

 

⑤main.dart

import 'package:flutter/material.dart';
import 'nend.dart';

void main() {
runApp(const MyApp());
}

class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);

@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
home: Scaffold(
body: Stack(
alignment: Alignment.center,
children: const [
Positioned(
top: 20.0,
width: 300.0,
height: 50.0,
child: MainContents(),
),
Positioned(
bottom: 0.0,
child: KoukokuNend(),
),
],
fit: StackFit.expand,
),
),
);
}
}

//メインコンテンツ
class MainContents extends StatelessWidget {
const MainContents({Key? key}) : super(key: key);

@override
Widget build(BuildContext context) {
return const Text("ここにメインコンテンツを書く");
}
}

 

これで完成!

こんな感じです。

f:id:panini0137:20220308085955p:plain

 

 

 

利用規約・プライバシーポリシー

利用規約・プライバシーポリシー

1.はじめに

ぱにーに(以下「当方」)は、スマートフォン用アプリケーション(以下「アプリ」)を開発・運用しています。本アプリのご使用によって、本規約に同意していただいたものとみなします。

 

2.収集する情報

アプリのご利用に際して、以下の利用者情報を取得いたします。

 

2.1 アプリケーションの利用状況の収集

当方が配信するアプリでは、広告配信のためにGoogle AdMob、利用状況解析のためにGoogle Firebase Analyticsを使用する場合がございます。

広告配信のために広告IDを取得していますが、個人を特定するためなどには使用しておりません。

取得する情報、利用目的、第三者への提供等の詳細につきましては、以下のプライバシーポリシーのリンクよりご確認ください。

AdMob(Google Inc.)

Firebase Analytics(Google Inc.)

 

2.2 お問い合わせやご意見を頂く際の個人情報の収集

・2.2.1 送信元のメールアドレス、 端末を識別する情報 (ユーザーサポートID)

・2.2.2 お問い合わせ内容

 

3. 利用目的

当方は、2.2 において収集した情報を、お問い合わせに対する返信のために利用いたします。また、2.2 において収集した情報を、本アプリの品質向上のために利用いたします。

 

4. 個人情報の管理

当方は、お客さまの個人情報を正確かつ最新の状態に保ち、個人情報への不正アクセス・紛失・破損・改ざん・漏洩などを防止するため、安全対策を実施し個人情報の厳重な管理を行ないます。

 

5. 個人情報の第三者への開示・提供の禁止

当方は、お客さまよりお預かりした個人情報を適切に管理し、次のいずれかに該当する場合を除き、個人情報を第三者に開示いたしません。

・お客さまの同意がある場合

・法令に基づき開示することが必要である場合

 

6. 法令、規範の遵守と見直し

当方は、保有する個人情報に関して適用される日本の法令、その他規範を遵守するとともに、本ポリシーの内容を適宜見直し、その改善に努めます。

 

7. 免責事項

本アプリがユーザーの特定の目的に適合すること、期待する機能・商品的価値・正確性・有用性を有すること、および不具合が生じないことについて、何ら保証するものではありません。

当方の都合によりアプリの仕様を変更できます。私たちは、本アプリの提供の終了、変更、または利用不能、本アプリの利用によるデータの消失または機械の故障もしくは損傷、その他本アプリに関してユーザーが被った損害につき、賠償する責任を一切負わないものとします。

 

8. 著作権知的財産権

著作権その他一切の権利は、当方又は権利を有する第三者に帰属します。

 

9. 連絡先

Mail : panini60602@gmail.com

 

【kotlin】ボタンの色や形を変える

ども!ぱにーにです!

アプリ開発で副業収入を狙ってます。

まだ駆け出しで勉強中ですけどね・・・

 

開発メモです。

ボタンの色の変え方が、ググってもなかなかうまくいかなくて、

試行錯誤して最終的に行きついた答えです。

これでうまくいきました!


①layoutのxmlでボタンの設定をする
「app:backgroundTint="@null"」がキモです!
app:backgroundTintでカラー指定するとボタンの色を変えられるようですが、
"@null"を指定することで色なし状態?にできるようです。
この設定をしないと、ボタンタッチしたとき等のselectorがうまく動きませんでした。

<Button
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:backgroundTint="@null"
    android:background="@drawable/button_background" />

 

②drawableに「button_background.xml」を作成
ここでselectorを使うことでボタンの状況が変わったときにビジュアルを変更することが可能です。
android:state_pressed="true"でボタンが押された状態
 ※話すとすぐにfalseになっているようです。
android:state_pressed="true"でボタンを押していない状態

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/button_shape_background_true"
        android:state_pressed="true"
        android:state_enabled="true"/>
    <item android:drawable="@drawable/button_shape_background_false"
        android:state_pressed="false"
        android:state_enabled="true"/>
</selector>


③drawableに「button_background_true.xml」を作成
②でボタンを押した状態(android:state_pressed="true")のときに呼び出される内容を定義

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape>
            <!-- ボタンの背景色を設定 -->
            <solid android:color="#FF0000" />
            <!-- ボタンの角丸を設定 -->
            <corners android:radius="32dp" />
        </shape>
    </item>
</selector>


④drawableに「button_background_false.xml」を作成
②でボタンを押していない状態(android:state_pressed="false")のときに呼び出される内容を定義

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape>
            <!-- ボタンの背景色を設定 -->
            <solid android:color="#00FF00" />
            <!-- ボタンの角丸を設定 -->
            <corners android:radius="32dp" />
        </shape>
    </item>
</selector>