diff --git a/flutter_samples/flutter_layout_application/lib/layout/singleColumnLayout.dart b/flutter_samples/flutter_layout_application/lib/layout/singleColumnLayout.dart
new file mode 100644
index 0000000000000000000000000000000000000000..65a5b992e7f8fc4aa7cd27a220864921d16041dc
--- /dev/null
+++ b/flutter_samples/flutter_layout_application/lib/layout/singleColumnLayout.dart
@@ -0,0 +1,83 @@
+import 'package:flutter/material.dart';
+
+import '../main.dart';
+
+class SingleColumnLayout extends StatefulWidget {
+  final CardItem cardItem;
+
+  const SingleColumnLayout({super.key, required this.cardItem});
+
+  @override
+  _SingleColumnLayoutState createState() => _SingleColumnLayoutState();
+}
+
+class _SingleColumnLayoutState extends State<SingleColumnLayout> {
+  CrossAxisAlignment _alignment = CrossAxisAlignment.start;
+
+  @override
+  Widget build(BuildContext context) {
+    return Column(
+      crossAxisAlignment: _alignment,
+      children: [
+        Column(
+          spacing: 20,
+          children: [borderedImage(), borderedImage(), borderedImage()],
+        ),
+        Row(
+          children: [
+            Text("Column crossAxisAlignment："),
+            Radio(
+              value: CrossAxisAlignment.start,
+              groupValue: _alignment,
+              onChanged: (CrossAxisAlignment? value) {
+                setState(() {
+                  _alignment = value!;
+                });
+              },
+            ),
+            Text('Start'),
+            Radio(
+              value: CrossAxisAlignment.center,
+              groupValue: _alignment,
+              onChanged: (CrossAxisAlignment? value) {
+                setState(() {
+                  _alignment = value!;
+                });
+              },
+            ),
+            Text('Center'),
+            Radio(
+              value: CrossAxisAlignment.end,
+              groupValue: _alignment,
+              onChanged: (CrossAxisAlignment? value) {
+                setState(() {
+                  _alignment = value!;
+                });
+              },
+            ),
+            Text('End'),
+            Radio(
+              value: CrossAxisAlignment.stretch,
+              groupValue: _alignment,
+              onChanged: (CrossAxisAlignment? value) {
+                setState(() {
+                  _alignment = value!;
+                });
+              },
+            ),
+            Text('stretch'),
+          ],
+        ),
+      ],
+    );
+  }
+
+  Widget borderedImage() {
+    return Image.asset(
+      'images/lake.jpg',
+      width: 200,
+      height: 160,
+      fit: BoxFit.cover,
+    );
+  }
+}
diff --git a/flutter_samples/flutter_layout_application/lib/layout/singleRowLayout.dart b/flutter_samples/flutter_layout_application/lib/layout/singleRowLayout.dart
index ebc6e8fa80c1c50c8033053541567330ece809ad..cd6f57b48fe5e2123965b783bb14df6ad68e438f 100644
--- a/flutter_samples/flutter_layout_application/lib/layout/singleRowLayout.dart
+++ b/flutter_samples/flutter_layout_application/lib/layout/singleRowLayout.dart
@@ -25,6 +25,7 @@ class _SingleRowLayoutState extends State<SingleRowLayout> {
           ),
           Row(
             children: [
+              Text("Row layout mainAxisAlignment:"),
               Radio(
                 value: MainAxisAlignment.start,
                 groupValue: _alignment,
diff --git a/flutter_samples/flutter_layout_application/lib/main.dart b/flutter_samples/flutter_layout_application/lib/main.dart
index f493beade24505772ff10d661943e3e1881435c3..38c1c2b465aa357e65b073f8d9bc1a697296f853 100644
--- a/flutter_samples/flutter_layout_application/lib/main.dart
+++ b/flutter_samples/flutter_layout_application/lib/main.dart
@@ -40,6 +40,11 @@ class _MyHomePageState extends State<MyHomePage> {
   List<CardItem> _cardItems = [
     CardItem(title: 'single', content: '基础 layout', key: 'single'),
     CardItem(title: 'single_row_layout', content: '简单横向布局', key: 'row_layout'),
+    CardItem(
+      title: 'single_column_layout',
+      content: '简单纵向布局',
+      key: 'column_layout',
+    ),
   ];
 
   void _onCategorySelected(String category) {
@@ -55,6 +60,11 @@ class _MyHomePageState extends State<MyHomePage> {
               content: '简单横向布局',
               key: 'row_layout',
             ),
+            CardItem(
+              title: 'single_column_layout',
+              content: '简单纵向布局',
+              key: 'column_layout',
+            ),
           ];
           break;
         case '设置':
diff --git a/flutter_samples/flutter_layout_application/lib/preview_page.dart b/flutter_samples/flutter_layout_application/lib/preview_page.dart
index 78c6503705e07e4ca99476488e3fdb8854271f4f..9f3cd7693cdc5c2ccc85d60bc432afc7f61273a8 100644
--- a/flutter_samples/flutter_layout_application/lib/preview_page.dart
+++ b/flutter_samples/flutter_layout_application/lib/preview_page.dart
@@ -1,5 +1,6 @@
 import 'package:flutter/material.dart';
 import 'package:flutter_layout_application/layout/project/columnLayoutProject.dart';
+import 'package:flutter_layout_application/layout/singleColumnLayout.dart';
 import 'package:flutter_layout_application/layout/singleLayout.dart';
 import 'package:flutter_layout_application/layout/singleRowLayout.dart';
 import 'main.dart'; // 引入 CardItem 类
@@ -27,6 +28,8 @@ class PreviewPage extends StatelessWidget {
       return ColumnLayoutProject();
     } else if (cardItem.key == 'row_layout') {
       return SingleRowLayout(cardItem: cardItem);
+    } else if (cardItem.key == 'column_layout') {
+      return SingleColumnLayout(cardItem: cardItem);
     } else {
       return Text(cardItem.content); // 根据需求调整逻辑
     }