Sample app in flutter

FlutterDialog.dart

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

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

class MyApp extends StatelessWidget {
  const MyApp();

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(
        primarySwatch: Colors.purple,
        buttonColor: Colors.purple,
        buttonTheme: const ButtonThemeData(textTheme: ButtonTextTheme.primary),
      ),
      home: const MyHomePage(),
    );
  }
}

class Actor {
  const Actor({this.name, this.description, this.age, this.imageUrl});

  final String name;
  final String description;
  final int age;
  final String imageUrl;
}

final String server = defaultTargetPlatform == TargetPlatform.android
    ? "https://api.androidhive.info"
    : "https://api.androidhive.info";

final List<Actor> actors = <Actor>[
  Actor(
      name: 'Tom Hardy',
      description: '(541) 754-3010',
      age: 5,
      imageUrl: '$server/json/images/tom_hardy.jpg'),
  Actor(
      name: 'Johnny Depp',
      description: '(452) 839-1210',
      age: 5,
      imageUrl: '$server/json/images/johnny.jpg'),
  Actor(
      name: 'Tom Cruise',
      description: '(541) 453-2311',
      age: 5,
      imageUrl: '$server/json/images/tom_cruise.jpg'),
  Actor(
      name: 'Keira Knightley',
      description: '(535) 324-4334',
      age: 5,
      imageUrl: '$server/json/images/keira.jpg'),
  Actor(
      name: 'Robert De Niro',
      description: '(767) 544-8867',
      age: 5,
      imageUrl: '$server/json/images/robert_de.jpg'),
  Actor(
      name: 'Leonardo DiCaprio',
      description: '(564) 333-2452',
      age: 5,
      imageUrl: '$server/json/images/leonardo.jpg'),
  Actor(
      name: 'Will Smith',
      description: '(541) 879-3453',
      age: 5,
      imageUrl: '$server/json/images/will.jpg'),
  Actor(
      name: 'Russell Crowe',
      description: '(234) 234-3321',
      age: 5,
      imageUrl: '$server/json/images/russell.jpg'),
  Actor(
      name: 'Brad Pitt',
      description: '(567) 754-8945',
      age: 5,
      imageUrl: '$server/json/images/brad.jpg'),
  Actor(
      name: 'Angelina Jolie',
      description: '(324) 754-5433',
      age: 5,
      imageUrl: '$server/json/images/angelina.jpg'),
  Actor(
      name: 'Kate Winslet',
      description: '(788) 343-3433',
      age: 5,
      imageUrl: '$server/json/images/kate.jpg'),
  Actor(
      name: 'Christian Bale',
      description: '(865) 755-3555',
      age: 5,
      imageUrl: '$server/json/images/christian.jpg'),
  Actor(
      name: 'Morgan Freeman',
      description: '(445) 776-9076',
      age: 5,
      imageUrl: '$server/json/images/morgan.jpg'),
  Actor(
      name: 'Hugh Jackman',
      description: '(544) 454-4544',
      age: 5,
      imageUrl: '$server/json/images/hugh.jpg'),
  Actor(
      name: 'Keanu Reeves',
      description: '(454) 455-5445',
      age: 5,
      imageUrl: '$server/json/images/keanu.jpg'),
  Actor(
      name: 'Tom Hanks',
      description: '(541) 454-4544',
      age: 5,
      imageUrl: '$server/json/images/tom.jpg'),
  Actor(
      name: 'Scarlett Johansson',
      description: '(545) 454-2567',
      age: 5,
      imageUrl: '$server/json/images/scarlett.jpg'),
  Actor(
      name: 'Robert Downey Jr.',
      description: '(444) 444-4444',
      age: 5,
      imageUrl: '$server/json/images/robert.jpg')
];

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

  Widget dialogBuilder(BuildContext context, Actor actor) {
    ThemeData localTheme = Theme.of(context);
    return SimpleDialog(contentPadding: EdgeInsets.zero, children: [
      Image.network(
        actor.imageUrl,
        fit: BoxFit.fill,
      ),
      Padding(
        padding: const EdgeInsets.all(16.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.stretch,
          children: [
            Text(
              actor.name,
              style: localTheme.textTheme.display1,
            ),
            Text(
              '${actor.age} monthe old',
              style: localTheme.textTheme.subhead.copyWith(
                fontStyle: FontStyle.italic,
              ),
            ),
            SizedBox(height: 16.0),
            Text(
              actor.description,
              style: localTheme.textTheme.body1,
            ),
            SizedBox(height: 16.0),
            Align(
              alignment: Alignment.centerRight,
              child: Wrap(
                children: [
                  Padding(
                    padding: const EdgeInsets.only(right: 10.0),
                    child: FlatButton(
                      onPressed: () {
                        Navigator.of(context).pop();
                      },
                      child: const Text('Close Dialog'),
                    ),
                  ),
                  RaisedButton(
                    onPressed: () {},
                    child: const Text('ADOPT'),
                  )
                ],
              ),
            )
          ],
        ),
      )
    ]);
  }

  Widget listItemBuilder(BuildContext context, int index) {
    return new GestureDetector(
      onTap: () => showDialog(
          context: context,
          builder: (context) => dialogBuilder(context, actors[index])),
      child: Container(
        padding: const EdgeInsets.only(left: 16.0),
        child: Text(actors[index].name,
            style: Theme.of(context).textTheme.headline),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Actor'),
      ),
      body: ListView.builder(
        itemCount: actors.length,
        itemExtent: 60.0,
        itemBuilder: listItemBuilder,
      ),
    );
  }
}