Blender 的使用筆記

前言

  雖然早就知道 Blender 2.8 時操作介面大改，但一直抽不出時間學習，所以一直都還是用 2.7 版，最近有空來學習就裝了 2.9 版，果然操作的方法都不太一樣了，加上預設安裝新的版本時不是覆蓋，而是新增一個安裝資料夾來安裝，才發現 2.7 的系統設定與外掛都要重新設定，所以決定寫一篇筆記方便在安裝完 Blender 以後調整成自己習慣的操作環境。

內容

預設選取鍵的修改

  在操作的部分是 2.7 習慣用"右鍵"來選擇物件，這違反直覺的設計一直以來都是 Blender 的特色，但 2.9 版可以改回"左鍵"，第一次開啟時會有視窗可以設定，預設為"左鍵"，之後想改可以在"Preferences"裡修改，如下圖

修改滑鼠選取鍵

顯示場景的統計資料

  這對需要知道模組的三角形的數量的人很重要，一樣在"Preferences"裡，如下圖

顯示場景統計訊息

修改背面剃除(Backface Culling)，繪製模式: Solid

  這個設定對需要知道三角形的正面與背面很重要，在預設值時會繪製雙面，這樣很容易分不清正面與反面，修改方式如下圖

修改背面剃除(Backface Culling)，繪製模式: Solid

修改背面剃除(Backface Culling)，繪製模式: Material Preview

  修改方式跟 Solid 時不一樣，這個設定在物件的 Material 裡並非總體設定，可以依據需要每個物件做不同的設定，如下圖修改

修改背面剃除(Backface Culling)，繪製模式: Material Preview

常用外掛: Rigify

  人體骨架有很多跟骨頭(Bone)，如果每次都要建一個相當費時，這個外掛可以方便產生人體骨架，安裝如下圖

安裝外掛: Rigify

安裝完後可以如下圖產生骨架

新增人體骨架的操作

常用外掛: LoopTools

  在建模時常常需要在平面上挖洞， LoopTools 裡有個功能相當方便，可以將選取的平片變成圓形，安裝如下圖

安裝外掛: LoopTools

操作畫面如下

在平面上挖一個圓

選取好評面上的面(faces)，再來按下右鍵，依上圖操作後，可以得到圖中左下的結果。

 初探 JavaScript 的 Map 物件

前言

  在 ES6 新增了 Map 物件，它和 Object 有什麼不一樣呢?在此把學習的過程做個紀錄。

內容

  ES6 提供了 Map 物件，在以前這樣的功能直接用 Object 就可以做出類似的的效果，但有個功能就不容易實現，就是 key 的型態不被侷限在 string ，可以用 number 作為 key ，接著看範例

let myObj = {
  'a' : 'This is a',
  'b' : 1234,
};
console.log(myObj.a );//This is a
console.log(myObj.b );//1234
//
let myMap = new Map();
myMap.set('a','This is a');
myMap.set('b',1234);
myMap.set(9999,'This is 9999');
console.log(myMap.get('a') );//This is a
console.log(myMap.get('b') );//1234
console.log(myMap.get(9999) );//This is 9999
//
let initMap = new Map([
  [ 'a' ,  1234],
  [ 'b' ,  5678],
  [ 'c' ,  9988],
] );
//
initMap.delete('c');
//Print map's content
initMap.forEach( function(value,key,map){
  console.log(` ${key} : ${value}`);
} );

//
console.log( initMap.size );//2
for( let key of initMap.keys() ){
  console.log( `initMap key:${key}` );
}
console.log( initMap.has('a') );//true
console.log( initMap.has('c') );//false

範例在開頭先用 Object 的方式來實現，接著看到 Map 的應用，透過 set() 來新增內容，再透過 get() 來取得對應的數值，注意這個 Map 同時包含了 string 與 number 的 key，這是舊的 Object 難以實現的。如果每次新增都要用 set() 來加會有些不方便，可以像 Object 一樣用 JSON 給嗎?答案是肯定的，範例用 initMap 來示範如何直接初始化 Map ，用起來很像但格式要注意，接著透過 delete() 來刪除內容，透過 foreach() 來列應內容，要注意 foreach() 的參數 function 的 參數排列順序是 value , key , map 。如果要取得有多少個內容的話可以透過 size ，但要注意它是個 property 而非 function。要作瀏覽 Map 時，可以透過 keys() 搭配 for ... of  來完成，最後還有常見的功能 has() ，用來確認 Map 是否有 key 。

  Map 的用法和常見的 dictionary 類似，但它的 key 型態不再侷限在 string 或 number 這樣的單一型態，算是一個滿特別的設計，可以解決以前要 number 當 key 時總是要作轉型的動作，加上又可以像 Object 一樣初始化，總體來說算是個好用的新功能。

 

參考資料

[ developer.mozilla.org ] Map

 初探預設參數

前言

  最近抽空來學習 JavaScript 的新功能"預設參數"，在此把學習的過程做個紀錄。

內容

  在舊的 JavaScript 裡的 function 參數都是不能給預設值，只能單純的命名，在喚起 function 時，有多少個參數就要輸入多少個參數，在新的 JavaScript 開始支援了。接著來看範例

function testCall(arg1 = 1234 , arg2 = 5678){
  console.log( `arg1:${arg1} arg2:${arg2}` );
};
function testCallForTest(arg1 =1234 ,arg2 ,arg3 = 5678){
  console.log( `arg1:${arg1} arg2:${arg2} arg3:${arg3}` );
};

testCall( 9999 , 8888 );//arg1:9999 arg2:8888
testCall( 9999 );//arg1:9999 arg2:5678
testCallForTest( 9999 );//arg1:9999 arg2:undefined arg3:5678
testCallForTest( 9999 , 8888 );//arg1:9999 arg2:8888 arg3:5678

範例第一次喚起 testCall() 時用一般喚起的方式(參數全給)，但在第二次少給一個，可以看到被替代的參數是第一個，接著注意到 testCallForTest() ，宣告時 arg2 並沒有給預設參數，藉此來看看會有什麼反應，第一次喚起 testCallForTest() 時只給了一個參數，結果是第二個參數變成 undefined ，但第三個參數的預設參數卻會成功給予，最後看到第二次喚起 testCallForTest() ，這次給了兩個參數，可以看到 arg2 有被正確地給予，且第三個參數的預設參數也有正確的給予。整體看下來預設參數的給予是有順序性的，總是從最前面參數來覆蓋，如果沒正常覆蓋只會給個 undefined ，並不會跳錯誤訊息，不過這是用 Chrome 所測試出來的反應，最後看了一下這個功能有個熱門瀏覽器 Opera 到現在還沒支援，如果要跨瀏覽器時要注意。

 

參考資料

[ developer.mozilla.org ] 預設參數( Default parameters )

 初探解構賦值

前言

  最近在學習 JavaScript 的新語法( ES6 以後) ，發現有個新語法"解構賦值"，由於用法有點特別所以在此做個紀錄。

內容

  先看到以下範例

let ar = [ 1 , 2 , 3 ,4 ];
//
[ a , b , c ] = ar;
console.log(a);//1
console.log(b);//2
console.log(c);//3
//
[ , , , d] = ar;
console.log(d);//4
//
[ e = 50 , f = 60] = [ 5 ];
console.log( e );//5
console.log( f );//60

解構複製的語法看起來有點奇怪，看起來像是陣列等於陣列，範例在開始時利用這個方法直接賦值到"a"、"b"與"c"，如果是舊的語法可能要打成3次賦值，或是用迴圈來賦值，到這裡看起來還好，接著看到如何賦值"d"，賦值時打了3個","，是為了跳過前三個元素，這樣就可以直接賦值第四個元素到到"d"，這語法我第一次看到時完全無法猜到這個語法在幹嘛，只能說要用"硬記"，最後解構賦值示範如何給預設值，當來源陣列元素比較少的時候就需要考慮，不然會跑出 undefined 的數值。

  整體來說這個語法可以改善要從一個陣列個別賦值時造成程式碼看起來很長的問題，如果陣列的內容數量很多的話也不太適合這個賦值，語法有些不好記，畢竟其它程式語言並沒有這樣的用法，雖然我應該還是不會用這個語法來寫程式碼，但為了跟他人合作這個語法要學起來。

 

參考資料

[ developer.mozilla.org ] 解構賦值