HW8

這學期修的數位媒體概論讓我有新的認知,發現原來電腦裡的很多視窗或是原建按鈕都是可以做出來的或以寫程式的方式來跑出東西也可以創造自己想要的形式,與其說他是簡單或是困難,不如就以有趣來形容這堂課吧!

看老師上課做出來的樣子看似很簡單,但是換到自己要製做出東西就覺得困難,因為自己程式也不是說很好也不太懂得要如何去描述自己所做的作業(其實第一次的作業我寫到很晚,還寫到哭,我的好同學可以證實...真是糗啊!),經過寫了第一次作業後又經過老師的講評後我就漸漸的之道要如何做好這樣子的作業而且也是老師要的東西,信心就大增!也會花時間去研究,和好同學都討論到很晚,但是還是有幾次作業都還是晚交,老師也不計較的還讓大家補教完整,而且也感受到老師上課方式很不一樣,沒有制式化的感覺,老師知道大家在某些程式方面有困難還犧牲自己的時間寫好範例程式給大家讓大家輕鬆的教作業(但自己也是要仔細研究一下就是嚕!),老師也說往後還是得靠自己寫出程式的!老師很喜歡和大家互動也很喜歡聽大家的意見不管是可行或不可行的老師都很樂意接受我們的想法(也讓大家加了不少分呢!),老師希望看到我們有學習到東西很重視大家的作業,上課時沒有考試的壓力,讓我們可以輕鬆學習,老師也介紹了週刊給我們,好讓我們的知識更豐富,還挺棒的~下學期我要記得跟老師訂購!!

HW5

這次的作業又不好意思的拖了好一陣子

*  將綠綠的金龜子圖可以讀取與顯示GIF影像檔案中的調色盤  *

一開始先用了 PSPad 去讀金龜子圖片的內容 看看有些什麼~是一串好多多的數字,這些數字是代表顏色 RGB (實在是太多了)

接著找尋到老師所放的範例程式,像第四次作業那樣,要開是跑程式看看是否有缺少些什麼

一開始就發現錯誤嚕!!

老師會打上這一行為的是一開始就是顯示這調色盤的工作面,但我因為延續前幾次的作業所以一開始它不知道要先顯是哪個工作面,所以會出現錯誤!!

所以我在這行敘述前面打上" // " 這樣他就不會跑這一行,而直接接下去~

就會發現好多錯誤~因為少了好多標籤~趕快補上吧!!

就跟第四次的作業一樣貼了好多該有的標籤

在程式中老師把原先的Image圖的名稱改為 " Palette (調色盤) " !!

不然他又不知道要去哪顯示圖片嚕!

 

再來就是要先讓調色盤先全部歸零,之後讀取的時候才能讀出圖裡面所有用到的顏色

但記得也要在 " Unit1.h " 中打上結構

還有就是GIF在PSPad內出現在前六個,所以版本要計算到第六個(GIF89a)

還有他的高和寬,在Unit1.h中也要打上他的結構

接著也是延續上面的動作,尋找不見的標籤!!

直到要開始顯是調色盤的動作了~終於啊!!

其中就會發現沒有給他來個 " int k " 他就不知道 k 要做什麼哩?!這對他來說是很困擾的!

替他補上去吧!!

這樣一來~調色盤就完成嚕!!

很不錯吧!

哈哈~其實我這是我改過的完整版~因為做錯的版本我在Unit1.h調色盤結構內打錯所以顯示的版本標籤就變成一串數字

我還嘗試了一下別的圖片~一定要是GIF的檔圖唷!

不然讀出來的調色盤會是空白的嘿!!

-----------------------------------------------------------------------------------------------------------------------------------

接下來的作業陸續的變深入了,都要和好同學討論好久,不然都霧煞煞了!!

修改的地方(Unit1.h結構那邊),也是弄了好久才懂,最後一次上課時,翰好同學發現調色盤顏色怪怪的一點都不像老師要的調色盤顏色~!還跑去問老師,結果發現是RGB順序打錯嚕!

HW4

這次我打算開新的檔案...

請讀取一張BMP影像,並將其影像內容顯示於C++ Builder 的影像元件之中.

* 要先在檔案的Unit1.h內打上"  #include "

開始跑程式,就會發現一些錯誤,因為他找不到所要用的變數,所以就要一一的去除錯,就會發現是少了一個int 還是少了一個OpenDialog 還是少了一個Label  

我那時就一個一個跑,就打出好要顯示的Label,看到我眼睛都要花了,不過每當有跑出一個就會想要再繼續,就會發現都要先給定int,其實只是Label名稱還有所要表是的東西不同,而運算方式都是一樣的

噢~我忘了!要記得先在Form1所做的File內多加一的開啟這張圖的路徑( MyOpenBMPFile1)喔!
不然就不能開圖嚕!

當所有的除錯都修改好後,該加的都加好後,開始跑嚕!

就發現為什麼開了圖卻顯示不出圖來(出錯),但把 iBitCount到 lblImportantColor->Caption 用" /* " 使這一大段先不看,這張圖就可以跑出來,就很好奇為什麼?明明就沒有錯誤啊!為什麼會這樣子啊?(這時就已經是下課時間了,老師也準備走嚕!就剛好也請教老師這個問題)

啊!原來喔~是程式中的 " delete imOriginal " 在作怪喔!

也不是說他在作怪啦!老師之所以會打上" delete imOriginal "是因為老師在ScrollBox元件下有擺了一張空白圖,當要開啟新的圖時," delet imOriginal "就會在這時候發會作用把原先的空白圖砍掉貼上開啟的圖! 就是這麼一回事啊!!

但因為我沒有在ScrollBox元件下襬空白圖所以我不需要用到" delete imOriginal ",我就用" // "(表示不看這行),這樣我就又可以回復原來的程式來跑(開啟圖)嚕!

                                  

這.....發生了跟老師遇到了一樣的問題! (哈......)

原來是我在一開始的fopen後面的mode忘了改成" rb " (老師還為了這個問題困擾了兩天).

而這張圖是老師在作業中另一個要求:

將圖 " 改成可以讀取影像寬度可以不是4的倍數的彩色影像.

終於.................

  

完成了....!

這次的作業其實應該早就要交了,但還是拖到現在才交,因為不知道要如何下手,所以就拖了兩個禮拜,直到上禮拜上課老師給我們範例程式,才知道所要表達的是什麼,也好讓我們從中學習,老師也說我們還是得自己多練習才會寫,因為以後出社會後不會有人給我們這麼好的範例程式.

HW3

*本週所要練習的題目是如何從BMP檔案中讀出相關的圖片資料

一開始要記得先到Unit1.h 裡打上 " #include " 喔!

再回到Unit1.cpp打上所要呈現出來的程式碼.

還要打上開啟檔案的路徑不然他會不知道要去哪兒找!

imBMP = fopen(OpenPictureDialog1->FileName.c_str(), "r");

* 其中 " c_str() " 是指轉換型別 AnsiString -> char 

接著就要開始設定要顯示出來的圖片資料

fread(cBuffer,1,2,imBMP);

位元組 #0-1 保存點陣圖文件的標識符，這兩個位元組的典型數據是BM

這時數據位置在2,

-------------------------------------------------------------------------------------------------------------------

fread(bSize,1,4,imBMP);

位元組 #2-5 使用一個dword保存點陣圖文件大小

這時數據位置在6

---------------------------------------------------------------------------------------------------------------------

int IFileSize = bSize[0] + bSize[1] * 256 + bSize[2] * 256*256 + bSize[3] * 256*256*256;

檔案大小

------------------------------------------------------------------------------------------------------------------------

fseek(imBMP,18,SEEK_SET);

這時數據位置指向18

位元組 #18-21 保存點陣圖寬度（以像素個數表示）

int ImageWidth = bSize[0] + bSize[1] * 256 + bSize[2] * 256*256 + bSize[3] * 256*256*256;

圖片的寬

-------------------------------------------------------------------------------------------------------------------------

fseek(imBMP,22,SEEK_SET);

這時數據位置指向22 (其實也可以不用打啦~!)

位元組 #22-25 保存點陣圖高度（以像素個數表示）

int iImageHeigh= bSize[0] + bSize[1] * 256 + bSize[2] * 256*256 + bSize[3] * 256*256*256;

圖片的高

---------------------------------------------------------------------------------------------------------------------------

在上上禮拜老師就有要我們自己先嘗試著以寫程式的方式去開啟資料夾裡的東西(fopen)

我還上網看了網路上的解釋, 但還是看不懂, 感覺很攏統, 不知道要如何寫, 而這禮拜老師就寫給我們看, 也解說給我們聽, 加上又問同學, 在筆記上寫上註解, 這樣也方面自己了解, 下次再寫的話也會比較清楚.希望可以越來越上手!

HW2

延續上一次的作業---讀入一個 24-bit 彩色 , bmp 影像 , 將其轉換成 8-bit 灰階影像儲存.

首先~我接著上次老師後來所教的繼續製作下去!!

捲軸盒的建立!

這一個步驟較簡單, 只需要選擇 Additional 分類項底下的 ScrollBox 元件, 就可以在Form中框出自己想要的捲軸盒大小喔!

*要注意的是: 要將圖片 減下 再 貼上 在捲軸框框上面喔!

(我一開始做的時候就沒有照著老師說的所以就跑不出來)

放入捲軸後呈現出來的樣貌

可以上下左右滑動唷! ( 以捲將圖拉到可看到右下角 )

到目前為止 都還算是簡單 但從下一個步驟開始就讓我覺得有些複雜

要在 Form 上顯示出所 Show 出來的圖片為幾位元

這是照著老師所教的 用 Switch 去判斷

我的圖片是屬於24位元的圖 (哈哈~其實彩色的圖幾乎都是24位元點陣圖)

再來就是重點啦~要將 24 位元圖轉換成 8 位元灰階圖

利用 for 迴圈 且 讀取每個點的顏色除以三原色所顯示出的圖片

*(R+G+B)/3

這樣就可以將圖片轉換成灰階圖了!

要記得做一的 Button 按鈕喔! 要把程式碼打在 Button Click 裡面, 這樣就可以將按鈕按下使要轉換的灰階圖顯示出來唷! 超神奇!

我還Show了一個 Message 讓你知道有轉換成功喔!

但是 不知道為什麼 已經轉換成灰階圖 卻還是顯是為24位元的圖

請老師為我解答~

再來就是最後步驟啦~製作完一個檔案, 當然也要把他儲存起來! 不然就沒有檔案可以找尋也不能回憶嚕@ @ 就好像白做工一樣!

這個步驟完成後就可以方便的將轉換後的灰階圖儲存起來了!

我將轉換過後的灰階圖另外儲存新檔 檔名為 " PRADA時尚派對_灰階圖 "

當時在課堂上練習時, 超級有挫折感, 一直很混淆, 但最後還是有做出來, 雖然作很慢 , 但挫折感就沒那麼大了, 真的要花時間下功夫, 不然我的挫折感會越來越大, 這樣就麻煩嚕!

HW1

先製作一個MainMenu , OpoePictureDailog.




要使圖片可以Show出來就要寫上一行程式 , 要使用Image , 但當時我忘記要去老師的部落格找還問了一下同學 , 才想起來可以到老師的部落格去找 ,才使我的照片可以大方的show出來. 看到圖片跳出來時有小小的成就感耶!


我使用的是多色彩且是今年最具有時尚風格的一張圖!



----------------------------------------------------------------

點選Lable(標籤) 製作滑鼠游標X ,Y軸. 還有 三原色色彩值.



接著我要使滑鼠移到圖片上時能跑出X軸和Y軸的座標值.色彩值.

先是在框出的範圍框框點一下在到左邊的Object Inspector / Events 下點選是要當滑鼠一動到圖片究顯示該XY軸值和色彩值 , 還是要點一下再顯示出來都可以 , 在點兩下就可以編輯程式了唷!

我選擇的是移動到圖片就可以顯示(OnMouseMove).

這時我才知道 lbl 就像 int一樣 是一個變數型態 可以去設X 和 Y.

但我卻忘了 AnsiString 這個東西 , 怎麼打都覺得怪怪的 ,問了我的好同學才知道這個要記住!

打出了X 軸 還有 Y軸的程式碼 , 相對的也要打上三原色的程式碼 紅 綠 藍 .

但要記得! 老師有提醒到說 Label的名稱要在Properties下的Name裡面改.

我在上課練習時就有犯這個錯誤 (在Caption裡改名稱是錯的喔!) !!



----------------------------------------------------------------

點選 Panel 製作使滑鼠經過圖片時可顯示滑鼠所指的顏色.



我選擇把Panel中的 " Panel1 "的字刪除,這樣比較好看(當顏色顯現出來時比較不壞礙眼).

也把原先恢恢醜醜的顏色改掉 ,改成藍色.

接著也是照上面的方法進入寫上程式碼 . 放入三原色的程式碼 .

我將滑鼠移到了桃紅色的地方, 所以Panel中會顯現出桃紅色.

不管我的滑鼠移到哪個區塊的顏色 , Panel中都會乖乖的顯示出我要看到的顏色喔!



----------------------------------------------------------------

製作畫筆 , 使得畫筆可在圖片上畫出線條或圖形.

*但要先在 Unit1.h 標頭檔裡的 private 打上需要的變數.




這個部份我就覺得比較困難 , 參考了課本第11-33頁到11-35頁.

才發現還要利用到標頭檔裡的東西去打上需要的變數 .我真的是要看花了眼呢!!




------------------------------------------------------------------

後來發現如果沒有指定畫筆的顏色 , 就只會畫出 所預設的"黑色".

不管選哪個顏色畫出來的顏色都是黑色 , 我超納悶 , 真的是不知道是為什麼耶!

點選綠色 , 畫出來的卻是黑色?!



紅筆圈起來的就是點選 綠色 所畫出來的 黑色.



-------------------------------------------------------------------

我還是請教了我的好同學....

所以要再加上 指定畫筆的程式碼 DrawColor=ColorDialog1->Color



才能畫出所點選的顏色.

*圖所點選畫筆顏色 畫出的是 藍色(上) 和 綠色(下).

哇!! 終於啊! 這樣就可以讓我想畫什麼顏色就畫什麼顏色在圖片上啦!!
我就隨便點兩個顏色先畫畫看! 藍色(上) 和 綠色(下).

真的顯現出我所點選的顏色耶!



---------------------------------------------------------------

就開始重新跑一遍我所製做的東西...

但在用畫筆時 , 當滑鼠點在圖片上畫線時 ,

不知道為什麼會有奇怪的影像 ,就是圖片會一閃一閃的...why?

我畫了紅色 , 綠色 , 黃色 的線.



*圖所顯示的就是此製作的總表現

可以 Show出圖 / MouseMove在圖上的 X(363) Y(15) ,

三原色色色彩值Red(1) Green(1) Blue(1) . Panel顯示出黑色 .

點選 Edit 裡的 ColorPanel 選擇畫筆顏色 , 使得可以在圖片上畫上線條或圖形(使用了 紅 , 綠 , 黃 ).

--------------------------------------------------------------------------------------------

呼~終於完成了! 第一堂課看老師再做按鈕元件時就有嚇一跳說原來可以自己做這些東西唷!

好酷喔! 可以自己設計想要表現的東西!就感到很有趣!但這次的作業做下來還是有感覺到是

有困難的 ,還是有些細部的地方要去注意! 上次上課就有被老師糾正了錯誤的地方!我有記起來喔!

還有詢問我的好同學也和他一起討論.

之後還會有更多的東西(BCB)可以玩吧!真的要好好的運用這本厚厚的課本!還要認真看老師製作的步驟 不然輪到自己製作時就一頭霧水嚕!