知識補充

lib/KnowledgePage.dart

@@ -1,5 +1,6 @@
 import 'package:flutter/material.dart';
 import 'package:topic/HomePage.dart';
+import 'package:url_launcher/url_launcher.dart';
 /*void main() {
   runApp(MaterialApp(
     home: KnowledgePage(),
@@ -36,14 +37,37 @@ class KnowledgePage extends StatelessWidget {
               padding: EdgeInsets.symmetric(vertical: 5), // 调整列表视图的 padding
               itemCount: 3,
               itemBuilder: (context, idx) {
+                // 根據索引設置不同的圖片和文字
+                String imagePath;
+                String title;
+                String description;
+                Widget detailPage; // 新增一個變數用於跳轉到不同的詳細頁面
+                String? url; // 新增一個變數來存放網址
+                if (idx == 0) {
+                  imagePath = 'assets/images/fallFactor.webp';
+                  title = '老人跌倒常見的危險因子';
+                  //description = '了解跌倒的各種潛在原因...';
+                  detailPage = FallCauseDetailPage();
+                } else if (idx == 1) {
+                  imagePath = 'assets/images/bathroom.webp';
+                  title = '如何在日常生活上預防跌倒?';
+                  //description = '哪些人容易跌倒？預防措施有哪些？';
+                  //url = 'https://www.hpa.gov.tw/Pages/Detail.aspx?nodeid=807&pid=4327';
+                  detailPage = FrequentFallersDetailPage();
+                } else {
+                  imagePath = 'assets/images/fallRescue1.webp';
+                  title = '跌倒了怎麼辦?';
+                  //description = '發生跌倒後的應急處理方法...';
+                  detailPage = FallSolutionDetailPage();
+                }
+
                 return InkWell(
                   onTap: () {
                     Navigator.push(
                       context,
                       MaterialPageRoute(
-                          builder: (context) => HomePage(
-                                email: email,
-                              )),
+                        builder: (context) => detailPage, // 根據選擇的文章跳轉到不同的詳細報導
+                      ),
                     );
                   },
                   child: Card(
@@ -51,28 +75,32 @@ class KnowledgePage extends StatelessWidget {
                     child: Column(
                       crossAxisAlignment: CrossAxisAlignment.start,
                       children: [
+                    ClipRRect(
+                    borderRadius: BorderRadius.circular(15.0), // 圓角設定
+                    child:
                         Image.asset(
-                          'lib/images/456.jpg',
+                          imagePath,
                           height: 180,
                           width: double.infinity,
                           fit: BoxFit.cover,
                         ),
+                    ),
                         Padding(
                           padding: EdgeInsets.all(10.0),
                           child: Text(
-                            '文章標題 $idx',
+                            title,
                             style: TextStyle(
                                 fontSize: 18, fontWeight: FontWeight.bold),
                           ),
                         ),
-                        Padding(
+                        /*Padding(
                           padding: EdgeInsets.symmetric(horizontal: 10.0),
                           child: Text(
-                            '這是文章的簡短描述...',
+                            description,
                             style: TextStyle(fontSize: 16),
                           ),
-                        ),
-                        SizedBox(height: 10),
+                        ),*/
+                        SizedBox(height: 20),
                       ],
                     ),
                   ),
@@ -80,8 +108,244 @@ class KnowledgePage extends StatelessWidget {
               },
             ),
           ),
+          SizedBox(height: 70),
         ],
       ),
     );
   }
 }
+
+// 詳細頁面之一：跌倒原因 //https://www.hpa.gov.tw/Pages/Detail.aspx?nodeid=807&pid=4327
+class FallCauseDetailPage extends StatelessWidget {
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      appBar: AppBar(
+        title: Text('跌倒原因'),
+        backgroundColor: Color(0xFFF5E3C3),
+      ),
+      body: SingleChildScrollView(
+        padding: EdgeInsets.all(16.0),
+        child: Column(
+          crossAxisAlignment: CrossAxisAlignment.start,
+          children: [
+            Text(
+              '老人跌倒常見的危險因子',
+              style: TextStyle(fontSize: 24, fontWeight: FontWeight.bold),
+            ),
+            SizedBox(height: 10),
+            Text(
+              '發布單位：衛生福利部國民健康署-慢性疾病防治組',
+              style: TextStyle(fontSize: 14, color: Colors.grey),
+            ),
+            SizedBox(height: 20),
+            Image.asset('assets/images/fallFactor.webp',
+              height: 180,
+              width: double.infinity,
+              fit: BoxFit.cover,
+            ),
+            SizedBox(height: 20),
+            Text(
+              '社會人口學因子',
+              style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold),
+            ),
+            SizedBox(height: 10),
+            // 條列式清單
+            buildBulletPoint('年齡：老人跌倒的風險隨年齡增加而上升。'),
+            buildBulletPoint('性別：年老女性跌倒的風險約是男性的兩倍。'),
+            buildBulletPoint('獨居：獨居老人跌倒的風險較高。'),
+            buildBulletPoint('其他:如跌倒史，缺乏運動，日常生活活動功能(ADL)或/及工具性日常生活活動功能(IADL)失能。'),
+            SizedBox(height: 20),
+            Text(
+              '身心功能、疾病與用藥',
+              style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold),
+            ),
+            SizedBox(height: 10),
+            buildBulletPoint('移動能力：步態與平衡是老人跌倒的重要危險因子。'),
+            buildBulletPoint('疾病：心臟病、中風、高血壓等疾病為老人跌倒的重要危險因子。'),
+            buildBulletPoint('藥物：使用多種藥物可能增加跌倒風險。'),
+            buildBulletPoint('生理失調：例如姿勢性低血壓會增加跌倒風險。'),
+            SizedBox(height: 20),
+            Text(
+              '環境因子',
+              style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold),
+            ),
+            SizedBox(height: 10),
+            buildBulletPoint('戶外環境：寒冷天氣、地面不平等會增加跌倒風險。'),
+            buildBulletPoint('居家環境：照明不足、地板太滑等都是潛在危險。'),
+            SizedBox(height: 60),
+          ],
+        ),
+      ),
+    );
+  }
+
+  // 方法來構建條列式清單
+  Widget buildBulletPoint(String text) {
+    return Padding(
+      padding: const EdgeInsets.only(bottom: 8.0),
+      child: Row(
+        crossAxisAlignment: CrossAxisAlignment.start,
+        children: [
+          Text('• ', style: TextStyle(fontSize: 16)),
+          Expanded(
+            child: Text(
+              text,
+              style: TextStyle(fontSize: 16),
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+}
+// 詳細頁面之二：常跌倒的人
+class FrequentFallersDetailPage extends StatelessWidget {
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      appBar: AppBar(
+        title: Text('如何在日常生活上預防跌倒?'),
+        backgroundColor: Color(0xFFF5E3C3),
+      ),
+      body: SingleChildScrollView(
+        padding: EdgeInsets.all(16.0),
+        child: Column(
+          crossAxisAlignment: CrossAxisAlignment.start,
+          children: [
+            Text(
+              '如何在日常生活上預防跌倒?',
+              style: TextStyle(fontSize: 24, fontWeight: FontWeight.bold),
+            ),
+            SizedBox(height: 10),
+            Text(
+              '發布單位：衛生福利部國民健康署-慢性疾病防治組',
+              style: TextStyle(fontSize: 14, color: Colors.grey),
+            ),
+            SizedBox(height: 20),
+            Image.asset('assets/images/bathroom.webp',
+              height: 180,
+              width: double.infinity,
+              fit: BoxFit.cover,
+            ),
+            SizedBox(height: 20),
+            Text(
+              '對於年長者而言，每週規律運動是需要的。運動不但可以增加肌力、柔軟度，也可提升身體平衡性，另外也請時常留意居住環境及人身安全，列舉相關注意要點如下：',
+              style: TextStyle(fontSize: 18,),
+            ),
+            SizedBox(height: 10),
+            buildBulletPoint('1.光線要明亮'),
+            buildBulletPoint('2.電線靠牆收'),
+            buildBulletPoint('3.地板保持乾燥'),
+            buildBulletPoint('4.移除平日活動路線上的雜物'),
+            buildBulletPoint('5.浴室加裝扶手'),
+            buildBulletPoint('6.確保樓梯扶手穩固'),
+            buildBulletPoint('7.選擇合適的鞋子及輔具'),
+            buildBulletPoint('8.下床、起身要緩慢'),
+            SizedBox(height:60),
+          ],
+        ),
+      ),
+    );
+  }
+
+  // 方法來構建條列式清單
+  Widget buildBulletPoint(String text) {
+    return Padding(
+      padding: const EdgeInsets.only(bottom: 8.0),
+      child: Row(
+        crossAxisAlignment: CrossAxisAlignment.start,
+        children: [
+          Text('• ', style: TextStyle(fontSize: 16)),
+          Expanded(
+            child: Text(
+              text,
+              style: TextStyle(fontSize: 16),
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+}
+// 詳細頁面之三：跌倒了怎麼辦 //https://www.dentist2home.com/post/%E7%A4%BE%E5%8D%80%E8%A3%A1%E6%AF%8F3%E4%BD%8D%E9%95%B7%E8%BC%A9%EF%BC%8C1%E4%BD%8D%E6%9C%89%E8%B7%8C%E5%80%92%E7%9A%84%E7%B6%93%E9%A9%97%EF%BC%8C%E8%A6%81%E5%A6%82%E4%BD%95%E9%A0%90%E9%98%B2%EF%BC%9F%E7%9C%9F%E7%9A%84%E8%B7%8C%E5%80%92%E4%BA%86%E8%A6%81%E8%99%95%E7%90%86%E5%91%A2%EF%BC%9F
+class FallSolutionDetailPage extends StatelessWidget {
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      appBar: AppBar(
+        title: Text('跌倒了怎麼辦?'),
+        backgroundColor: Color(0xFFF5E3C3),
+      ),
+      body: SingleChildScrollView(
+        padding: EdgeInsets.all(16.0),
+        child: Column(
+          crossAxisAlignment: CrossAxisAlignment.start,
+          children: [
+            Text(
+              '跌倒了怎麼辦?',
+              style: TextStyle(fontSize: 24, fontWeight: FontWeight.bold),
+            ),
+            SizedBox(height: 10),
+            Text(
+              '發布單位：牙驛通',
+              style: TextStyle(fontSize: 14, color: Colors.grey),
+            ),
+            SizedBox(height: 20),
+            Text(
+              '自己跌倒怎麼辦？',
+              style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold),
+            ),
+            SizedBox(height: 10),
+            // 條列式清單
+            buildBulletPoint('1. 不小心跌倒後應保持冷靜，不要亂動，同時檢查傷勢和高聲呼救。'),
+            buildBulletPoint('2. 若受傷部位腫起來或有劇烈疼痛時，可能已發生骨折，應靜候救援'),
+            buildBulletPoint('3. 附近無人可提供幫助時，不要直接站起，應以在地上滑動的方式，到最近的電話求救。'),
+            SizedBox(height: 20),
+            Image.asset('assets/images/fallRescue1.webp',
+              height: 180,
+              width: double.infinity,
+              fit: BoxFit.cover,
+            ),
+            SizedBox(height: 20),
+            Text(
+              '別人跌倒怎麼辦？',
+              style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold),
+            ),
+            SizedBox(height: 10),
+            // 條列式清單
+            buildBulletPoint('1. 當發現長者跌倒時，不要慌張，也不要急著將他拉起來，可能會造成長者傷勢加重。'),
+            buildBulletPoint('2. 檢查跌倒長者意識狀況，以及受傷或出血等狀況。'),
+            buildBulletPoint('3. 若發現長者有意識不清或大量出血情形，應盡快叫救護車並送醫急救。'),
+            SizedBox(height: 20),
+            Image.asset('assets/images/fallRescue2.webp',
+              height: 180,
+              width: double.infinity,
+              fit: BoxFit.cover,
+            ),
+            SizedBox(height: 60),
+          ],
+        ),
+      ),
+    );
+  }
+
+  // 方法來構建條列式清單
+  Widget buildBulletPoint(String text) {
+    return Padding(
+      padding: const EdgeInsets.only(bottom: 8.0),
+      child: Row(
+        crossAxisAlignment: CrossAxisAlignment.start,
+        children: [
+          Text('• ', style: TextStyle(fontSize: 16)),
+          Expanded(
+            child: Text(
+              text,
+              style: TextStyle(fontSize: 16),
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+}

pubspec.yaml

@@ -31,7 +31,7 @@ dependencies:
   flutter:
     sdk: flutter
   mysql_client: ^0.0.27
-
+  url_launcher: ^6.0.10
 
   # The following adds the Cupertino Icons font to your application.
   # Use with the CupertinoIcons class for iOS style icons.
@@ -60,7 +60,13 @@ dev_dependencies:
 
 # The following section is specific to Flutter packages.
 flutter:
-
+  assets:
+    - assets/images/456.jpg
+    - assets/images/123.jpg
+    - assets/images/bathroom.webp
+    - assets/images/fallFactor.webp
+    - assets/images/fallRescue1.webp
+    - assets/images/fallRescue2.webp
   # The following line ensures that the Material Icons font is
   # included with your application, so that you can use the icons in
   # the material Icons class.