Home » 8.0 線上教學 » 1-2 基礎教學:物件的基本操作

1-2 基礎教學:物件的基本操作

本節學習目標

  • 物件基本操作
  • 實際建立一個按鈕與文字物件並進行編輯
  • 透過特性視窗或工具列調整物件



1-2-basic-operation-1
本章節會利用商品頁面的物件來做一系列的模擬練習:

首先,從左方 Libraries 窗格拖曳出一個 Button Shape(按鈕物件),可利用雙擊編輯按鈕文字,將其更改為「加入購物車」。接著使用工具列可編輯 Libraries 的樣式,例如:外框色彩、填滿色彩、字型和字體大小。

您也可以在 Wireframe 中利用複製(Ctrl+C)與貼上(Ctrl+V)的方式來新增物件。


1-2-basic-operation-2
在選取您想要編輯的 Widget 後,若想改變物件大小有以下三幾種方法:

  1. 直接拖曳
  2. 上方工具列
  3. Inspector: Rectangle 窗格的 STYLE


1-2-basic-operation-3
在 Inspector: Rectangle 窗格的STYLE 下 可以修改該 Widget 的屬性及樣式:

  1. 填充的顏色
  2. 陰影
  3. 邊框
  4. 圓角
  5. 不透明度


1-2-basic-operation-4
在 Inspector: Rectangle 窗格的 STYLE 下亦可修改該文字樣式:

  1. 文字樣式
  2. 行距
  3. 符號
  4. 對齊方式
  5. 間距