Download presentation
Presentation is loading. Please wait.
1
PHP+MySQL互動式網頁程式設計班 範例實作-電子相簿 講師:林業峻 CSIE, NTU 7 / 4, 2010
2
課程大綱 電子相簿簡介 建立相簿 列出相簿 上傳照片 列出相簿中的照片 作業
3
電子相簿 電子相簿為目前最流行的網頁應用之一,主要功 能為給予使用者一個空間提供建立相簿與上傳照 片與人分享。
電子相簿主要由許多不同主題的相簿組成,其中 各個相簿又由許多照片所組成。主要功能: 建立相簿 建立一個相簿或活動主題,提供使用者瀏覽相關照片。 上傳照片 在已建立的相簿中,提供介面讓使用者將照片上傳到該相簿。 瀏覽照片 提供介面給使用者點選相簿並觀看其中的照片。
4
電子相簿設計的挑戰 相簿與照片資料表的規劃 相簿與照片檔案的規劃
相簿與照片資料表欄位的設計 相簿與照片檔案的規劃 資料夾與檔案的建立 上傳照片檔案存在的後續處理 以下實作範例將使用兩個資料表來區分相簿與照 片的描述並使用資料夾代表相簿,來存放相關照 片(不使用MySQL存放照片檔)。
5
課程大綱 電子相簿簡介 建立相簿 列出相簿 上傳照片 列出相簿中的照片 作業
6
建立相簿 建立步驟與設計考量: 在MySQL資料庫中建立資料表 (gallery_album)
需要有拍攝者、主題、拍攝日期等欄位 提供表單讓使用者填寫資料的HTML網頁 (gallery_album_add.php) 需要能填寫拍攝者、主題、拍攝日期 接收表單的PHP程式 (gallery_album_add_action.php) 確任是否填寫拍攝者、主題、拍攝日期 將使用者輸入日期轉為 "西元年-月-日" 插入到MySQL資料表gallery_album 跳出新增相簿成功並自動跳回相簿首頁: gallery.php
7
相簿主題資料表 在MySQL中,建立一個gallery_album資料表, 其中欄位包括: sn: 資料序號 name: 拍攝者
title: 主題 date: 拍攝日期 (date格式:西元年-月-日) (其他你想要記錄的資訊…)
8
練習 請完成下列範例程式chap08中PHP程式之功能 gallery_album_add_action.php
9
課程大綱 電子相簿簡介 建立相簿 列出相簿 上傳照片 列出相簿中的照片 作業
10
列出相簿 建立步驟與設計考量: 列出所有相簿主題的PHP程式 (gallery.php)
建立一個超連結名為[新增相簿],連結到: gallery_add.php 建立一個表格,表格欄位包括主題、拍攝者、拍攝日期 選擇MySQL資料表gallery_album中所有資料 使用重複控制(迴圈),將資料表中所有資料顯示在表格的每一列中。 上一步的過程中,印出主題時要加入超連結連到觀看相簿內容頁面,並 使用GET方式將要看的相簿主題之序號傳到該頁面: gallery_album.php
11
練習 請完成下列範例程式chap08中PHP程式之功能 gallery.php
12
課程大綱 電子相簿簡介 建立相簿 列出相簿 上傳照片 列出相簿中的照片 作業
13
上傳照片 建立步驟與設計考量: 在MySQL資料庫中建立資料表 (gallery_photo)
需要有相簿主題序號、照片主題說明、照片檔名等欄位 提供表單讓使用者填寫資料的HTML網頁 (gallery_photo_add.php) 使用GET方式接收要上傳的相簿序號 確任是否有收到序號 需能填寫照片主題說明、上傳檔案來源 將要上傳的相簿序號再用POST方式傳遞給接收表單的程式 接收表單的PHP程式 (gallery_photo_add_action.php) 確任是否收到要上傳的相簿序號與主題說明、上傳檔案來源 判斷相簿資料夾是否存在,不存在則建立資料夾(名稱為相簿序號) 判斷照片檔名是否存在,存在則改變檔名 (參考第五章檔案上傳) 將照片檔由暫存檔用新指定的檔名搬到相簿資料夾 插入到MySQL資料表gallery_photo 跳出上傳成功並自動跳回顯示相簿內容頁面: gallery_album.php ,並使 用GET方式相簿序號傳到該頁面
14
上傳照片資料表 在MySQL中,建立一個gallery_photo資料表, 其中欄位包括: sn: 資料序號
album_sn: 相簿主題序號 (資料夾名稱) title: 照片主題說明 file_name: 照片檔名 (檔案名稱) (其他你想要記錄的資訊…)
15
判斷資料夾存在與建立資料夾 當我們想使用PHP來建立資料夾時,第一個步驟 要先檢查該資料夾名稱是否存在。可使用PHP的 is_dir函式來判斷,再使用mkdir建立資料夾。 PHP的判斷資料夾名稱存在函式 is_dir("資料夾名稱"); 資料夾不存在則回傳 " "。 PHP的建立資料夾函式 mkdir("資料夾名稱"); 建立一個使用者自訂名稱的資料夾。 範例: if(is_dir("資料夾名稱") == "") { }
16
練習 請完成下列範例程式chap08中PHP程式之功能 gallery_photo_add_action.php
17
課程大綱 電子相簿簡介 建立相簿 列出相簿 上傳照片 列出相簿中的照片 作業
18
列出相簿中的照片 建立步驟與設計考量: 修改觀看相簿內照片的PHP程式 (gallery_album.php)
使用GET方式接收要觀看的相簿主題序號 確任是否有收到序號 建立一個超連結名為[新增照片],並使用GET方式將要新增的相簿主題之 序號傳到該頁面: gallery_photo_add.php 選擇MySQL資料表gallery_photo中相簿主題序號欄位與GET方式取得 之序號一致的資料 使用重複控制(迴圈),將資料表中所有資料列在表格中,(表格每列有四 個欄位放四張照片與照片主題說明。
19
練習 請完成下列範例程式chap08中PHP程式之功能 gallery_album.php
20
課程大綱 電子相簿簡介 建立相簿 列出相簿 上傳照片 列出相簿中的照片 作業
21
作業-電子相簿 使用PHP+MySQL製作一個電子相簿程式 延續chap08/gallery.php功能
建立一個電子相簿程式,新增設定相簿封面功能: 列出相簿: 在gallery.php中每列相簿主題前新增一個相簿封面欄位並顯示該相簿封面照 片。(若尚未設定封面則不顯示照片) 列出相簿中的照片: 在gallery_album.php中所有列出之照片後加入一個[設為封面]連結,按下該 連結後,設該照片為將此相簿之封面,並自動跳回gallery.php 範例請參考:hw4/gallery.php
22
繳交 使用FTP上傳 請使用FileZilla上傳作業至指定FTP主機 繳交期限:2010. 7/11(日) 主機: 使用者名稱: 密碼:
連接埠: 將程式存到自己學號之hw4資料夾 檔名: gallery.php 請使用FileZilla上傳作業至指定FTP主機 繳交期限: /11(日) 公佈解答後,不再收繳交作業
Similar presentations