|
|
| (同じ利用者による、間の7版が非表示) |
| 行1: |
行1: |
| − | ==admob-expoの公式==
| + | [[Javascript/reactnative/admob/expo/基本]] |
| − | https://docs.expo.io/versions/latest/sdk/admob/
| + | |
| | | | |
| − | ==admobプラグインのインストール==
| + | [[Javascript/reactnative/admob/expo/mediation]] |
| − | $ expo install expo-ads-admob
| + | |
| − | | + | |
| − | app.json にandroidとiosを追加
| + | |
| − | <pre>
| + | |
| − | {
| + | |
| − | "expo": {
| + | |
| − | "name": "Ads Showcase",
| + | |
| − | "android": {
| + | |
| − | "config": {
| + | |
| − | "googleMobileAdsAppId": "ca-app-pub-3940256099942544~3347511713" // sample id, replace with your own
| + | |
| − | }
| + | |
| − | },
| + | |
| − | "ios": {
| + | |
| − | "config": {
| + | |
| − | "googleMobileAdsAppId": "ca-app-pub-3940256099942544~1458002511" // sample id, replace with your own
| + | |
| − | }
| + | |
| − | }
| + | |
| − | }
| + | |
| − | }
| + | |
| − | </pre>
| + | |
| − | | + | |
| − | ==サンプル==
| + | |
| − | バナー、インステ、リワード動画
| + | |
| − | <pre>
| + | |
| − | import React from 'react';
| + | |
| − | import { Button, StyleSheet, Text, View } from 'react-native';
| + | |
| − | import {
| + | |
| − | AdMobBanner,
| + | |
| − | AdMobInterstitial,
| + | |
| − | AdMobRewarded,
| + | |
| − | setTestDeviceIDAsync,
| + | |
| − | } from 'expo-ads-admob';
| + | |
| − | | + | |
| − | export default class App extends React.Component {
| + | |
| − | | + | |
| − | bannerError() {
| + | |
| − | console.log("An error")
| + | |
| − | }
| + | |
| − | | + | |
| − | showInterstitial = async() => {
| + | |
| − | await setTestDeviceIDAsync('EMULATOR');
| + | |
| − | AdMobInterstitial.setAdUnitID('ca-app-pub-3940256099942544/1033173712'); // Test ID, Replace with your-admob-unit-id
| + | |
| − | await AdMobInterstitial.requestAdAsync();
| + | |
| − | await AdMobInterstitial.showAdAsync();
| + | |
| − | }
| + | |
| − | | + | |
| − | showRewarded = async() => {
| + | |
| − | await setTestDeviceIDAsync('EMULATOR');
| + | |
| − | AdMobRewarded.setAdUnitID('ca-app-pub-3940256099942544/5224354917') // Test ID, Replace with your-admob-unit-id
| + | |
| − | await AdMobRewarded.requestAdAsync()
| + | |
| − | await AdMobRewarded.showAdAsync()
| + | |
| − | }
| + | |
| − | | + | |
| − | render() {
| + | |
| − | return (
| + | |
| − | <View style={styles.container}>
| + | |
| − | <Text>AdMob</Text>
| + | |
| − | <Button
| + | |
| − | title="Interstitial"
| + | |
| − | onPress={this.showInterstitial}
| + | |
| − | containerViewStyle={styles.interstitialBanner}
| + | |
| − | />
| + | |
| − | <Button
| + | |
| − | title="RewardVideo"
| + | |
| − | onPress={this.showRewarded}
| + | |
| − | containerViewStyle={styles.rewardedBanner}
| + | |
| − | />
| + | |
| − | <AdMobBanner
| + | |
| − | style={styles.bottomBanner}
| + | |
| − | bannerSize="smartBannerLandscape"
| + | |
| − | adUnitID="ca-app-pub-3940256099942544/6300978111"
| + | |
| − | // Test ID, Replace with your-admob-unit-id
| + | |
| − | setTestDeviceIDAsync="EMULATOR"
| + | |
| − | didFailToReceiveAdWithError={this.bannerError}
| + | |
| − | />
| + | |
| − | </View>
| + | |
| − | );
| + | |
| − | }
| + | |
| − | }
| + | |
| − | const styles = StyleSheet.create({
| + | |
| − | rewardedBanner: {
| + | |
| − | width: "100%",
| + | |
| − | marginLeft: 0
| + | |
| − | },
| + | |
| − | interstitialBanner: {
| + | |
| − | width: "100%",
| + | |
| − | marginLeft: 0
| + | |
| − | },
| + | |
| − | bottomBanner: {
| + | |
| − | position: "absolute",
| + | |
| − | bottom: 0
| + | |
| − | },
| + | |
| − | PublisherBanner: {
| + | |
| − | position: "absolute",
| + | |
| − | bottom: 80
| + | |
| − | },
| + | |
| − | container: {
| + | |
| − | flex: 1,
| + | |
| − | backgroundColor: '#fff',
| + | |
| − | alignItems: 'center',
| + | |
| − | justifyContent: 'center',
| + | |
| − | },
| + | |
| − | });
| + | |
| − | </pre>
| + | |
| − | | + | |
| − | ===バナーサイズ指定===
| + | |
| − | <pre>
| + | |
| − | banner 320x50
| + | |
| − | largeBanner 320x100
| + | |
| − | mediumRectangle 300x250
| + | |
| − | fullBanner 468x60
| + | |
| − | leaderboard 728x90
| + | |
| − | smartBannerPortrait Screen width x 32
| + | |
| − | smartBannerLandscape Screen width x 32
| + | |
| − | </pre>
| + | |
| − | | + | |
| − | ==バナー位置==
| + | |
| − | フッター
| + | |
| − | bottomBanner: {
| + | |
| − | position: "absolute",
| + | |
| − | bottom: 0
| + | |
| − | },
| + | |
| − | ヘッダー
| + | |
| − | bottomBanner: {
| + | |
| − | position: "absolute",
| + | |
| − | top : 0
| + | |
| − | },
| + | |
| − | | + | |
| − | ===setTestDeviceIDAsyncのfunctionは存在しないと出たとき===
| + | |
| − | 以下エラーが出たとき
| + | |
| − | [Unhandled promise rejection: TypeError: _expoAdsAdmob.AdMobInterstitial.setTestDeviceIDAsync is not a function.
| + | |
| − | 以下のように対応する
| + | |
| − | <pre>
| + | |
| − | import {
| + | |
| − | AdMobBanner,
| + | |
| − | AdMobInterstitial,
| + | |
| − | AdMobRewarded,
| + | |
| − | setTestDeviceIDAsync,
| + | |
| − | } from 'expo-ads-admob';
| + | |
| − | await setTestDeviceIDAsync('EMULATOR');
| + | |
| − | </pre>
| + | |
| − | ===setTestDeviceID は非推奨と出たとき===
| + | |
| − | 以下エラーが出たとき
| + | |
| − | AdMobInterstitial.setTestDeviceID is deprecated. Test device IDs are now set globally. Use AdMob.setTestDeviceIDAsync instead.
| + | |
| − | setTestDeviceIDは非推奨なので、setTestDeviceIDAsyncを使う
| + | |
| − | | + | |
| − | ==参考==
| + | |
| − | https://honmushi.com/2019/11/28/expo-admob/
| + | |
