processing筆記－01二進制圖片效果
（1）圖片準備工作：
我想要實現的呢，是在一個視頻文件中的蘋果電腦顯示屏上
用一個動態的01二進制顯示，效果如下：
下面是工程文件還有圖片，大家可自行食用～
鏈接:https://pan.baidu.com/s/1DLbX7AkSrV8r-bgt6qLJqA 密碼:wr7n
（1）將圖片比例放在合適尺寸
一些參數：
1、所要將圖片填充的視頻區域:322＊182 （從ps中藍屏區域的到）
2、調整區域大小：兩倍 width=644 height=394 （爲了使以後插入到視頻中顯得高清一點，可以縮小而不是拉伸放大，增加清晰度。
3、在ps中生成的數字，自己使用ps繪製的圖片（因爲當時繪製時每張圖片的大小沒有統一，爲了方便後面排版，將數字圖片大小統一。
取四張圖片中比例最大的，以它爲標準: 117／172＝ 0.68
屏幕寬排列20個圖片：
（1）新數字的寬度：644px的畫布區域／20 約爲32px
（2）按照原數字比例得到高度：32px/47px =0.68
（3）計算出按照畫布高度，垂直方向，可以排布8個圖片：height 8n 47px
按照ps製作新數字圖片：
如圖，看到畫面損失了很多細節，所以如果所要佈局的畫布較大，建議在ps上重新按照新數字的長寬比重新繪圖。
（2）將圖片放入processing編程文件的同一文件夾下：
並且按照數字順序排列
（3）編碼：
共分爲兩個主要模塊：change() paint()
change()
主要功能生成隨機地址：
loadImage 官方文檔
1、將圖像加載到PImage類型的變量中。可以加載四種類型的圖像（.gif，.jpg，.tga，.png）圖像。爲了正確加載，圖像必須位於當前草圖的數據目錄中。
2、在大多數情況下，請在setup（）中加載所有圖像以在程序開始時預加載它們。在draw（）中加載圖像會降低程序的速度。除非圖像位於setup（）運行之後調用的函數內部，否則無法將它們加載到setup（）外部。
void change()
{
for(int i=0;i<num;i++)
{
//int()強制轉換 隨機選擇0-3的地址
img[i]=loadImage(int(random(0,4))+”.png”);
}
}
paint()
主要功能繪製：
不太明白爲什麼else中的n=0能讓整個畫面數字按照順序向右移動？誰能解答一下？？
代碼：
void paint()
{
//change();
for(int j=0;j<8;j++){
for(int i=0;i<20;i++){
if(n<num)
{
image(img[n],i*32,j*47);
n++;
}
else{
// change();
n=0;
//paint();
// move();
}
}
}
}
//previously speaking
//pc resolution:2304/1440=1.6
//pc in video resolution:322*182
//pc double: width=644 height=394
//num proportion: 0.68 117*172 width:20n 32px/47px =0.68 height 8n 47px
PImage []img;
int num=20*8;
int n=0;
//void move()
//{
// for(int j=0;j<8;j++){
// for(int i=0;i<20;i++){
// if(n<num)
// {
// image(img[n],(i++)*32,(j++)*47);
// n++;
// }
// }
// }
//}
void change()
{
for(int i=0;i<num;i++)
{
img[i]=loadImage(int(random(0,4))+".png");
}
}
void paint()
{
//change();
for(int j=0;j<8;j++){
for(int i=0;i<20;i++){
if(n<num)
{
image(img[n],i*32,j*47);
n++;
}
else{
// change();
n=0;
//paint();
// move();
}
}
}
}
void setup()
{
size(640,378);
frameRate(10);
img=new PImage[num];
change();
//paint();
}
void draw()
{
background(255);
// change();
paint();
}
(1)
(2)
(3)
1、img 存儲的地址是不變的，沒有發生更改
2、n=0
3、draw()每次刷新都會調用paint()函數
當在else中，添加change()代碼，則不會出現上面按順序的情況，會產生隨機排列數字，但是有一處有空白的地方是按順序依此變化的。
void paint()
{
//change();
for(int j=0;j<8;j++){
for(int i=0;i<20;i++){
if(n<num)
{
image(img[n],i*32,j*47);
n++;
}
else{
change();
n=0;
//paint();
// move();
}
}
}
}
大家可以更改一下change()的位置，如果先在draw()中添加change()正如官方文檔所說速度變慢。
刪掉framerate後會發現刷新速度變得賊快。。
寫在後面：
1、在筆者編寫代碼的時候，一開始始終無法實現讓插入的動畫動起來，但是在多番嘗試下，忽然動起來了，但是又陷入了沉思，它是爲什麼動起來的，思考了半天，擱淺了半天，還是沒想出來，記錄一下。
2、小總結
不用把代碼都寫在setup與 draw當中，在前面添加函數，調用，可以實現代碼的複用。
draw()會刷新 setup()執行一次 framerate()寫在setup中
Image img；
setup()中：img=loadImage(“1.png”);//同一文件夾下 img=new PImage;
draw()中：image(img,x,y);