在GridView中实施admob原生广告

时间：2020-05-02 04:32:14

标签： android flutter admob

我正在制作一个墙纸应用程序，我制作了墙纸网格，我想在此GridView中实现原生广告，但是我不知道如何做？

有人可以帮我实现吗，我尝试了很多事情，但没有一个对我有用

这就是我想要的-

This is what i want

我要在这里实施-

import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
import '../views/wallpaper.dart';
import '../../core/utils/models/response.dart';

class WallpaperList extends StatefulWidget {
  final List<Post> posts;
  final ThemeData themeData;

  WallpaperList({@required this.posts, @required this.themeData});

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



class _WallpaperListState extends State<WallpaperList> {

  @override
  void initState() {
    super.initState();

  }



  @override
  Widget build(BuildContext context) {
    return widget.posts.length == 0
        ? SizedBox(
            height: 200,
            child: Column(
              children: <Widget>[
                Padding(
                  padding: const EdgeInsets.all(16.0),
                  child: Icon(FontAwesomeIcons.sadCry,
                      size: 30, color: widget.themeData.accentColor),
                ),
                Text(
                  'Seems like what you are looking for, is empty.',
                  style: widget.themeData.textTheme.body2,
                )
              ],
            ),
          )
        : wallpaperGrid(widget.posts);
  }

  Widget wallpaperGrid(List<Post> list) {
    return GridView.builder(
      gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
          crossAxisCount: 2, childAspectRatio: 0.7),
      padding: const EdgeInsets.all(0),
      itemCount: list.length,
      shrinkWrap: true,
      physics: ScrollPhysics(),
      scrollDirection: Axis.vertical,
      itemBuilder: (BuildContext context, int index) {
        return Card(
          elevation: 10,
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(15.0),
          ),
          child: GestureDetector(
            onTap: () {
              Navigator.push(
                  context,
                  MaterialPageRoute(
                      builder: (context) => WallpaperPage(
                            heroId: 'popular${list[index].name}',
                            posts: list,
                            index: index,
                          )));
            },
            child: Hero(
              tag: 'popular${list[index].name}',
              child: SizedBox(
                width: double.infinity,
                height: 300,
                child: ClipRRect(
                  borderRadius: BorderRadius.circular(15.0),
                  child: CachedNetworkImage(
                    errorWidget: (context, url, error) => Container(
                      width: double.infinity,
                      height: double.infinity,
                      child: Center(
                        child: Icon(
                          Icons.error,
                          color: widget.themeData.accentColor,
                        ),
                      ),
                    ),
                    fit: BoxFit.cover,
                    placeholder: (context, url) => Center(
                      child: Container(
                          width: double.infinity,
                          height: double.infinity,
                          color: widget.themeData.primaryColorDark,
                          child: Center(
                              child: CircularProgressIndicator(
                            valueColor: AlwaysStoppedAnimation(
                                widget.themeData.accentColor),
                          ))),
                    ),
                    imageUrl:
                        list[index].preview.images[0].resolutions.length <= 3
                            ? widget
                                .posts[index]
                                .preview
                                .images[0]
                                .resolutions[list[index]
                                        .preview
                                        .images[0]
                                        .resolutions
                                        .length -
                                    1]
                                .url
                                .replaceAll('amp;', '')
                            : list[index]
                                .preview
                                .images[0]
                                .resolutions[3]
                                .url
                                .replaceAll('amp;', ''),
                  ),
                ),
              ),
            ),
          ),
        );
      },
    );
  }
}

请帮助，我们将不胜感激

2 个答案:

答案 0 :(得分：0)

以下是在交错的GridView中实现Admob原生广告的示例


import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_staggered_grid_view/flutter_staggered_grid_view.dart';
import 'package:flutter_native_admob/flutter_native_admob.dart';
import 'package:flutter_native_admob/native_admob_controller.dart';
import 'package:cached_network_image/cached_network_image.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  var _list = List<IMageClass>();

  static const _adUnitID = "ca-app-pub-3940256099942544/8135179316";

  final _nativeAdController = NativeAdmobController();
  double _height = 0;

  @override
  void initState() {
    super.initState();
    _getData();
  }

  Widget Images(int index) {
    return CachedNetworkImage(
      imageUrl: _list[index].images,
      placeholder: (context, string) {
        return Center(
          child: CupertinoActivityIndicator(),
        );
      },
      imageBuilder: (context, imageProvider) => Container(
        decoration: BoxDecoration(
          image: DecorationImage(
            image: imageProvider,
            fit: BoxFit.cover,
          ),
        ),
      ),
      errorWidget: (context, url, error) => Icon(Icons.error),
    );
  }

  List<String> imageList = [
    'https://images.unsplash.com/photo-1515886657613-9f3515b0c78f',
    'https://images.unsplash.com/photo-1529626455594-4ff0802cfb7e',
    'https://images.unsplash.com/photo-1513956589380-bad6acb9b9d4',
    'https://images.unsplash.com/photo-1521577352947-9bb58764b69a',
    'https://images.unsplash.com/photo-1488161628813-04466f872be2',
    'https://images.unsplash.com/photo-1501196354995-cbb51c65aaea',
    'https://images.unsplash.com/photo-1515886657613-9f3515b0c78f',
    'https://images.unsplash.com/photo-1529626455594-4ff0802cfb7e',
    'https://images.unsplash.com/photo-1513956589380-bad6acb9b9d4',
    'https://images.unsplash.com/photo-1521577352947-9bb58764b69a',
    'https://images.unsplash.com/photo-1488161628813-04466f872be2',
    'https://images.unsplash.com/photo-1501196354995-cbb51c65aaea',
    'https://images.unsplash.com/photo-1515886657613-9f3515b0c78f',
    'https://images.unsplash.com/photo-1529626455594-4ff0802cfb7e',
    'https://images.unsplash.com/photo-1513956589380-bad6acb9b9d4',
    'https://images.unsplash.com/photo-1521577352947-9bb58764b69a',
    'https://images.unsplash.com/photo-1488161628813-04466f872be2',
    'https://images.unsplash.com/photo-1501196354995-cbb51c65aaea',
    'https://images.unsplash.com/photo-1515886657613-9f3515b0c78f',
    'https://images.unsplash.com/photo-1529626455594-4ff0802cfb7e',
    'https://images.unsplash.com/photo-1513956589380-bad6acb9b9d4',
    'https://images.unsplash.com/photo-1521577352947-9bb58764b69a',
    'https://images.unsplash.com/photo-1488161628813-04466f872be2',
    'https://images.unsplash.com/photo-1501196354995-cbb51c65aaea',
    'https://images.unsplash.com/photo-1515886657613-9f3515b0c78f',
    'https://images.unsplash.com/photo-1529626455594-4ff0802cfb7e',
    'https://images.unsplash.com/photo-1513956589380-bad6acb9b9d4',
    'https://images.unsplash.com/photo-1521577352947-9bb58764b69a',
    'https://images.unsplash.com/photo-1488161628813-04466f872be2',
    'https://images.unsplash.com/photo-1501196354995-cbb51c65aaea',
  ];

  void _getData() {
    for (int i = 0; i < imageList.length; i++) {
      var image = IMageClass();

      if (i != 0) {
        if (i % 4 == 3) {
          image.type = "GoogleAd";
        } else {
          image.type = "";
          image.images = imageList[i];
        }
        _list.add(image);
      } else {
        image.type = "";
        image.images = imageList[i];
        _list.add(image);
      }
    }
  }

  Widget _getAdContainer() {
    return Container(
      height: 250,
      child: NativeAdmob(
        // Your ad unit id
        adUnitID: "ca-app-pub-3940256099942544/8135179316",
        controller: _nativeAdController,
        type: NativeAdmobType.banner,
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
          margin: EdgeInsets.all(12),
          child: StaggeredGridView.countBuilder(
            crossAxisSpacing: 3.0,
            mainAxisSpacing: 3.0,
            // controller: scrollController,
            itemCount: _list.length,
            physics: ScrollPhysics(),
            itemBuilder: (context, index) {
              if (_list[index].type != "GoogleAd")
                return Images(index);
              else
                return _getAdContainer();
            },
            crossAxisCount: 2,
            staggeredTileBuilder: (int index) {
              if (_list[index].type != "GoogleAd")
                return StaggeredTile.count(1, 1);
              else
                return StaggeredTile.count(2, 1);
              // return StaggeredTile.count(1, 1);
            },
          )),
    );
  }
}

class IMageClass {
  String images;
  String type;
}

答案 1 :(得分：-1)

您可以尝试这样的事情。

  Widget _buildListView() {
    final int size = 10;

    List<Widget> _children = List<Widget>.generate(
      size,
      (int index) => _buildListItem(text: "Index: $index"),
    );

    _children.insert(
      2,
      Padding(
        padding: EdgeInsets.symmetric(vertical: 8.0, horizontal: 16),
        child: ClipRRect( // rounded corners ad.
          borderRadius: BorderRadius.circular(40.0),
          child: AdmobBanner(
            adUnitId: getBannerAdUnitId(),
            adSize: AdmobBannerSize.LEADERBOARD,
          ),
        ),
      ),
    );

    return ListView(
      children: _children,
    );
  }

  Widget _buildListItem({String text}) {
    return Container(
      width: double.infinity,
      height: 150,
      margin: EdgeInsets.symmetric(vertical: 8.0, horizontal: 16),
      child: Card(
        color: Colors.indigo,
        child: Padding(
          padding: const EdgeInsets.all(8.0),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: <Widget>[
              Text(
                text,
                style: TextStyle(
                  color: Colors.white,
                ),
              ),
              Padding(padding: EdgeInsets.all(16)),
              Text(
                "This is a test widget.",
                style: TextStyle(fontSize: 18, color: Colors.white),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

String getAppId() {
  if (Platform.isIOS) {
    return 'android';
  } else if (Platform.isAndroid) {
    return 'ios';
  }
  return null;
}

String getBannerAdUnitId() {
  if (Platform.isIOS) {
    return 'ios add unit';
  } else if (Platform.isAndroid) {
    return 'android ad unit';
  }
return null;

了解更多from this blog result

相关问题
最新问题