CustomScrollView PageView issue inside StatefulWidget

custom_scroll_view_page_view_issue.dart

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      routes: {
        '/': (context) => HomePage(),
      },
    );
  }
}

class HomePage extends StatefulWidget {
  @override
  HomePageState createState() {
    return new HomePageState();
  }
}

class HomePageState extends State<HomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Home'),
      ),
      body: CustomScrollView(
        slivers: <Widget>[
          SliverFixedExtentList(
            itemExtent: 300.0,
            delegate: SliverChildListDelegate([
              PageView(
                children: <Widget>[
                  Center(child: Text("Page 1")),
                  Center(child: Text("Page 2")),
                  Center(child: Text("Page 3")),
                ],
              ),
            ]),
          ),
          SliverList(
            delegate:
                SliverChildBuilderDelegate((BuildContext context, int index) {
              return GestureDetector(
                onTap: () => _openSecondPage(context),
                child: Container(
                  height: 200.0,
                  color: Colors.red,
                  child: Text("item$index"),
                ),
              );
            }, childCount: 20),
          ),
        ],
      ),
    );
  }

  _openSecondPage(BuildContext context) {
    Navigator.of(context).push(MaterialPageRoute(builder: (_) => SecondPage()));
  }
}

class SecondPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container();
  }
}