diff --git a/lib/ext/24/main.dart b/lib/ext/24/main.dart
new file mode 100644
index 0000000..f6ff9be
--- /dev/null
+++ b/lib/ext/24/main.dart
@@ -0,0 +1,80 @@
+import 'package:flutter/material.dart';
+
+import 'navigation/left_navigation/left_router_delegate.dart';
+import 'navigation/right_navigation/right_router_delegate.dart';
+
+void main() {
+  runApp(const MyApp());
+}
+
+class MyApp extends StatelessWidget {
+  const MyApp({super.key});
+
+  // This widget is the root of your application.
+  @override
+  Widget build(BuildContext context) {
+    return MaterialApp(
+      debugShowCheckedModeBanner: false,
+      title: 'Flutter Demo',
+      theme: ThemeData(
+        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
+        useMaterial3: true,
+      ),
+      home: const MyHomePage(title: 'Flutter Demo Home Page'),
+    );
+  }
+}
+
+class MyHomePage extends StatefulWidget {
+  const MyHomePage({super.key, required this.title});
+
+  // This widget is the home page of your application. It is stateful, meaning
+  // that it has a State object (defined below) that contains fields that affect
+  // how it looks.
+
+  // This class is the configuration for the state. It holds the values (in this
+  // case the title) provided by the parent (in this case the App widget) and
+  // used by the build method of the State. Fields in a Widget subclass are
+  // always marked "final".
+
+  final String title;
+
+  @override
+  State<MyHomePage> createState() => _MyHomePageState();
+}
+
+class _MyHomePageState extends State<MyHomePage> {
+  int _counter = 0;
+
+  void _incrementCounter() {
+    setState(() {
+      // This call to setState tells the Flutter framework that something has
+      // changed in this State, which causes it to rerun the build method below
+      // so that the display can reflect the updated values. If we changed
+      // _counter without calling setState(), then the build method would not be
+      // called again, and so nothing would appear to happen.
+      _counter++;
+    });
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    // This method is rerun every time setState is called, for instance as done
+    // by the _incrementCounter method above.
+    //
+    // The Flutter framework has been optimized to make rerunning build methods
+    // fast, so that you can just rebuild anything that needs updating rather
+    // than having to individually change instances of widgets.
+    return Scaffold(
+      body: Row(
+        children: [
+          Expanded(child: Router(routerDelegate: leftRouterDelegate,)),
+          Expanded(child: Router(routerDelegate: rightRouterDelegate,
+
+          )),
+        ],
+      ),
+ // This trailing comma makes auto-formatting nicer for build methods.
+    );
+  }
+}
diff --git a/lib/ext/24/navigation/left_navigation/left_router_delegate.dart b/lib/ext/24/navigation/left_navigation/left_router_delegate.dart
new file mode 100644
index 0000000..fab7d11
--- /dev/null
+++ b/lib/ext/24/navigation/left_navigation/left_router_delegate.dart
@@ -0,0 +1,59 @@
+import 'package:flutter/material.dart';
+import '../../../../15/03/transition/fade_transition_page.dart';
+import '../../pages/detail_page.dart';
+import '../../pages/home_list.dart';
+
+
+
+final LeftRouterDelegate leftRouterDelegate = LeftRouterDelegate();
+
+class LeftRouterDelegate extends RouterDelegate<Object> with ChangeNotifier {
+  String _value = '/home';
+
+  String get value => _value;
+
+  set value(String value) {
+    _value = value;
+    notifyListeners();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Navigator(
+      onPopPage: _onPopPage,
+      pages: _buildPageByPath(value),
+    );
+  }
+
+  @override
+  Future<bool> popRoute() async {
+    print('=======popRoute=========');
+    return true;
+  }
+
+  bool _onPopPage(Route route, result) {
+    return route.didPop(result);
+  }
+
+  @override
+  Future<void> setNewRoutePath(configuration) async {}
+
+  List<Page> _buildPageByPath(String value) {
+    Uri uri = Uri.parse(value);
+    List<Page> page = [];
+    if (uri.path == '/detail') {
+      page.add(FadeTransitionPage(
+          key: ValueKey(value),
+          child: DetailPage(
+            id: uri.queryParameters['id'] ?? '0',
+          )));
+    }
+    if (uri.path == '/home') {
+      page.add(FadeTransitionPage(
+          key: ValueKey(value),
+          child: HomeListPage(
+          )));
+    }
+    return page;
+  }
+}
diff --git a/lib/ext/24/navigation/right_navigation/right_router_delegate.dart b/lib/ext/24/navigation/right_navigation/right_router_delegate.dart
new file mode 100644
index 0000000..b39ef89
--- /dev/null
+++ b/lib/ext/24/navigation/right_navigation/right_router_delegate.dart
@@ -0,0 +1,50 @@
+import 'package:flutter/material.dart';
+import 'package:iroute/15/03/transition/fade_transition_page.dart';
+import '../../pages/detail_page.dart';
+
+final RightRouterDelegate rightRouterDelegate = RightRouterDelegate();
+
+class RightRouterDelegate extends RouterDelegate<Object> with ChangeNotifier {
+  String _value = '/detail?id=0';
+
+  String get value => _value;
+
+  set value(String value) {
+    _value = value;
+    notifyListeners();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Navigator(
+      onPopPage: _onPopPage,
+      pages: _buildPageByPath(value),
+    );
+  }
+
+  @override
+  Future<bool> popRoute() async {
+    print('=======popRoute=========');
+    return true;
+  }
+
+  bool _onPopPage(Route route, result) {
+    return route.didPop(result);
+  }
+
+  @override
+  Future<void> setNewRoutePath(configuration) async {}
+
+  List<Page> _buildPageByPath(String value) {
+    Uri uri = Uri.parse(value);
+    List<Page> page = [];
+    if (uri.path == '/detail') {
+      page.add(FadeTransitionPage(
+          key: ValueKey(value),
+          child: DetailPage(
+            id: uri.queryParameters['id'] ?? '0',
+          )));
+    }
+    return page;
+  }
+}
diff --git a/lib/ext/24/pages/detail_page.dart b/lib/ext/24/pages/detail_page.dart
new file mode 100644
index 0000000..3fccc8f
--- /dev/null
+++ b/lib/ext/24/pages/detail_page.dart
@@ -0,0 +1,48 @@
+import 'dart:ffi';
+
+import 'package:flutter/material.dart';
+
+import '../navigation/left_navigation/left_router_delegate.dart';
+import '../navigation/right_navigation/right_router_delegate.dart';
+
+class DetailPage extends StatefulWidget {
+  final String id;
+  const DetailPage({super.key, required this.id});
+
+  @override
+  State<DetailPage> createState() => _DetailPageState();
+}
+
+class _DetailPageState extends State<DetailPage> {
+
+
+  @override
+  void initState() {
+    super.initState();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      appBar: AppBar(
+        leading: BackButton(
+          onPressed: (){
+            leftRouterDelegate.value = '/home';
+            rightRouterDelegate.value = '/detail?id=${widget.id}';
+          },
+        ),
+        title: Text('商品详情'),),
+      body: Center(child: Column(
+        children: [
+          Text('商品${widget.id}'),
+          const SizedBox(height: 30,),
+          Text('这是商品${widget.id}的详细信息\n'*10),
+          ElevatedButton(onPressed: (){
+            leftRouterDelegate.value =  '/detail?id=${widget.id}';
+            rightRouterDelegate.value =  '/detail?id=100';
+          }, child: Text('推荐 100'))
+        ],
+      ),),
+    );
+  }
+}
diff --git a/lib/ext/24/pages/home_list.dart b/lib/ext/24/pages/home_list.dart
new file mode 100644
index 0000000..2126791
--- /dev/null
+++ b/lib/ext/24/pages/home_list.dart
@@ -0,0 +1,31 @@
+import 'dart:ffi';
+
+import 'package:flutter/material.dart';
+
+import '../navigation/right_navigation/right_router_delegate.dart';
+
+class HomeListPage extends StatefulWidget {
+  const HomeListPage({super.key});
+
+  @override
+  State<HomeListPage> createState() => _HomeListPageState();
+}
+
+class _HomeListPageState extends State<HomeListPage> {
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      appBar: AppBar(
+
+        title: Text('商品列表'),),
+      body: ListView.builder(itemBuilder: (_,index)=>ListTile(
+        onTap: ()=>_onTap(index),
+        title: Text('商品$index'),
+      )),
+    );
+  }
+
+  void _onTap(int index) {
+    rightRouterDelegate.value = '/detail?id=$index';
+  }
+}