Photobooth專案_第一階段_介面_一個視窗設計上的要求_不能有上方工作列_希望跳頁不是關閉視窗又產生一個新的



校外工作要求:

執行效果順序


先跳出  photo booth 的 封面

過個幾秒自動跳至下一畫面


緊接著 跳至 給別人選擇相框樣式的畫面
右上角有個會計數的東西

使用者使用滑鼠進行選取相框的動作

選好後跳至下一畫面

進行拍照流程

每隔十秒做一次更新


拍好之後 顯示給使用者作檢閱看滿不滿意

如果不滿意就有個  回去重拍的按鈕

滿意就按跳至下一頁面
緊接著進行存檔

程式就結束  完成其工作流程


===========================

特殊要點   
這次需結合Kinect V2的背景移除效果

而且再添加相框




介面布局規範
(1)
要能夠跳頁(但是不能產生新視窗的要在同一個面板做跳頁)
(2)
不能出現上方醜醜的狀態列(放大、縮小、關閉)



先解決 取消秀出上方狀態標題列

視窗去右側 --> 屬性  --> 勾消 FormBorderStyle


再來是同一面板上 的 分頁跳動 設計


首先跟大家介紹一個東西叫做  Panel 

這個組件  可以協助我們完成在同一個面板做跳頁喔!!!

捨麼!!!!!真的嗎???

【Panel1】無
首先我把視窗介面的背景換成一個符合專案主題的圖片素材


之後上方可能會插入  類似 Photo Booth 等 創意互動相框

字眼


這裡我是把Panel 疊在上面喔


【Panel2】兩個 pictureBox

這裡我們要繼續做  第二分頁

用來秀我們的Kinect V2 背景移除效果的影像

這裡我們要進行兩個不同背景環境效果的融入選擇


這裡我將第二個  Panel 疊在上方

改為  富士山作為背景

在上方  放兩個  pictureBox 組件

供使用者選擇 Kinect V2 背景


【Panel3】兩個 pictureBox
依此類推增加第三個  Panel  供使用者選擇相框


【Panel4】: pictureBox + 兩個 Button 
最後一個Panel 供使用者做列印選擇及預覽是否滿意
及返回鍵







使用  Emgucv  + Kinect V2

首先添加  Emgucv 2.4.10   以及 Kinect V2 的 庫










緊接著   先完成  跳頁的功能

我們針對下方兩個   Button 做 事件的撰寫


我們有好多個  Panel  對不對???

一個非常好的   朋友   叫做   List 

當我們視窗載入的同時,這些Panel也要被加進來







這裡發現有放置不同背景後效果非常差

所以用另一個 徒法煉鋼法

=======================================


修正一下思考一下

其實第一頁不應該放  Back的  按鈕
容易誤導使用者  甚至產生 程式碼錯誤




再重拉一個  panel --->  Dock 選 fill




加兩個  Button  

測試一下代碼


回上一頁

Panel1  會給使用者 做背景預覽與選擇

Panel2

目前效果







Panel3
我應該要秀    
Kinect背景移除合成照 再加上 Emgucv 相框疊圖的

疊加效果

只需要顯示一張   pictureBox 即可



最終  介面運作影片






留言

  1. 您好,對於Photobooth這個程式有興趣,目前有個專案,請問你是否有接案這個?

    回覆刪除

張貼留言

這個網誌中的熱門文章

經得起原始碼資安弱點掃描的程式設計習慣培養(五)_Missing HSTS Header

經得起原始碼資安弱點掃描的程式設計習慣培養(三)_7.Cross Site Scripting(XSS)_Stored XSS_Reflected XSS All Clients

(2021年度)駕訓學科筆試準備題庫歸納分析_法規是非題