Chỉ dẫn dùng Image trong Sketch

Image hay biểu tượng trong Sketch là tính năng vô cùng hữu ích lúc thiết kế. Hãy cùng chúng tôi tìm hiểu phương pháp dùng Image trong Sketch hiệu quả như thế nào nhé!

Sketch Sketch cho Mac

Những biểu tượng có thể tăng cường tiến trình công việc bằng phương pháp cho phép bạn lưu và tái dùng những thành phần thường lúc thiết kế. Lúc ứng dụng những thay đổi đổi lên 1 Image, chúng sẽ xuất hiện trên khắp mọi nơi bạn đã dùng nó trong bản thiết kế. Thậm chí, bạn có thể tạo những override cho những phần nào đấy của từng Image.

Tạo 1 Image

Để tạo Image, hãy chọn 1 nhóm, Artboard hoặc layer và tích Create Image trong thanh công cụ hoặc Layer › Create Image trên menu. Đặt tên cho Image của bạn và chọn gửi phiên bản chính của nó tới 1 trang Symbols riêng hoặc lưu nó trên trang hiện đang dùng.

Image chính và phụ

Lúc tạo 1 Image, Sketch tạo cả grasp (bản chính) và occasion (bản phụ) của nó. Bạn thoải mái tạo nhiều phiên bản Image phụ như ý muốn nhưng sẽ chỉ có 1 bản chính duy nhất. Trường hợp thay đổi đổi bản chính, hành động đấy cũng sẽ hiện trên những phiên bản bất kỳ của Image đấy trong tài liệu của bạn.

Trường hợp chọn Ship Image lớn “Symbols” web page, bạn sẽ thấy 1 trang new nằm trên Layer Listing, mang trong mình tên Symbols. Tại đây, bạn sẽ tìm thấy bản chính của mình. Ngược lại, giả dụ ko chọn hành động này, nó sẽ hiện trên trang hiện tại hay Artboard của chính nó.

Bí quyết biến 1 Image thành những lớp

Để đưa Image trở lại thành những lớp thông thường, chọn phiên bản chính của Image trong Layer Listing và click on Layer > Convert Image lớn Artboard. Bất kỳ phiên bản nào liên quan tới nó sẽ trở nên nhóm và chỉnh sửa bản chính ko còn thay đổi đổi những phiên bản này.

Bí quyết thay đổi thế 1 layer bằng Image

Lúc tạo xong 1 Image, bạn có thể chèn nó vào bất kỳ lớp hiện có nào trong bản thiết kế. Để làm cho việc này, click on chuột cần vào 1 layer, nhấn Substitute With, rồi chọn Image. Image bạn chọn sẽ thay đổi đổi kích thước để thích hợp có kích thước layer đấy.

Chèn Image

Bạn có 2 phương pháp để truy cập và chèn Symbols vào Sketch.

Bạn có thể chèn những biểu tượng qua Elements Panel sang bên trái của Canvas bằng phương pháp click on vào Elements trên phía trên cùng Layer Listing (bạn cũng có thể dùng Ctrl+1 và Ctrl+2 để chuyển đổi giữa Elements Panel và Layer Listing tương ứng).

Bạn sẽ có tùy thuộc} chọn xem “All” – toàn bộ Image có sẵn hoặc chỉ những biểu tượng thuộc về tài liệu cá nhân hay thư viện Library nào đấy.

Bạn có thể dùng thanh kiếm tìm bên dưới Elements Panel để nhanh chóng tìm thấy Image đang kiếm tìm. Tiếp theo, bạn chỉ cần kéo & thả biểu tượng đấy quản lý vào Canvas.

Bên cạnh ra, bạn có thể chèn 1 Image qua Insert trong Toolbar hoặc dùng Insert Menu. Tại đây, bạn có thể xem và chọn từ tài liệu Symbols hoặc biểu tượng thuộc về bất kỳ Library nào đã kích hoạt.

Chỉnh sửa Image

Bạn có 2 phương pháp chính để chỉnh sửa Image. Bạn có thể chỉnh sửa nội dung trong phiên bản Image chính hoặc có thể chỉnh sửa riêng từng phiên bản cùng có những override.

Bí quyết chỉnh sửa 1 biểu tượng chính

Tìm bản chính hoặc click on vào bất kỳ phiên bản nào của 1 Image để truy cập nó. Mọi chỉnh sửa bạn thực hành trên Image chính sẽ được đồng bộ khắp những phiên bản phụ của nó trong thiết kế. Lúc hoàn thành mọi thay đổi đổi, chọn Return lớn Occasion để quay lại phiên bản đấy và xem những điều chỉnh của bạn đã được đồng bộ như thế nào.

Bí quyết chỉnh sửa những phiên bản bằng Override

Chọn 1 phiên bản Image và bạn sẽ thấy 1 phần những override hiện trong Inspector. Bằng phương pháp chỉnh sửa những override này tại đây, bạn có thể thay đổi đổi nội dung bên trong 1 occasion Image cá nhân mà ko thay đổi đổi bản chính hoặc liên quan tới bất kỳ phiên bản nào khác của nó.

Xem Thêm  Bộ đề luyện từ và câu lớp 5 (Có đáp án) Ôn tập Tiếng Việt lớp 5

Lưu ý: Bạn cũng có thể nhập nội dung Override cho những phiên bản Image quản lý trong canvas.

Bí quyết làm cho nổi bật những override

Chọn phiên bản Image của bạn và trỏ chuột qua nó để làm cho nổi bật bất kỳ override có sẵn, click on vào 1 trong số đấy để tìm thấy nó nhanh chóng và tự động động hiển thị nó trong Inspector. Hành động này hữu ích lúc bạn có 1 Image chứa siêu nhiều override (cho những override lồng nhau).

1 giải pháp khác là hãy click on vào hình tam giác ngoài tên Image trong Inspector và chọn những override tại đấy. Bạn cũng có thể click on điều khiển vào 1 override trong Layer Listing để xem những tùy thuộc} chọn liên quan.

Lưu ý: Ngay cả lúc đã tập trung vào 1 override cụ thể, những hành động như vận động, sao chép nó đều sẽ được ứng dụng cho toàn bộ phiên bản phụ nhưng ko cho lớp override cụ thể. Bạn sẽ cần dùng bản Image chính để thay đổi đổi lớp override của nó.

Bí quyết dùng Textual content Overrides

Bạn có thể thay đổi đổi nội dung của Overrides theo 2 phương pháp: Click on đúp vào 1 lớp textual content trong phiên bản Image trên Canvas và gõ nội dung new vào bên trong hoặc nhập nội dung vào trường override trên Inspector. Xóa bất kỳ thứ gì trong trường đấy sẽ đưa nó trở lại nội dung trên Image chính. Bạn cũng có thể dùng icon Information trên trường này để xác định vùng override.

Lưu ý: Trường hợp nội dung override ko dài hơn bản gốc ban đầu trên biểu tượng chính, Sketch sẽ vận động layer bất kỳ ngoài lớp textual content của bạn lúc nó mở rộng. Trường hợp muốn cố định những lớp và giữ lại nội dung trên chúng, bạn cần khóa những layer đấy lại trong bản Image chính.

Bí quyết dùng Picture Overrides

Bạn có thể ghi đè lớp ảnh hay hình dạng bất kỳ bằng 1 fill trong Inspector. Chỉ cần kéo 1 ảnh vào trình xem trước hoặc chọn Select Picture… Bạn cũng có thể dùng Information để gắn những override ảnh bằng phương pháp click on vào icon Information. Để loại bỏ 1 ảnh, click on vào cửa sổ xem trước ảnh và nhấn phím phương pháp.

Bí quyết dùng Override Textual content và Layer Kinds

Trường hợp đã thiết lập Textual content Kinds hay Layer Kinds trong bản thiết kế, bạn sẽ thấy chúng trong bảng Overrides trên Inspector.

Bí quyết Override những điểm tạo mẫu

Trường hợp đã thêm 1 Hotspot vào phiên bản Image chính như 1 phần của mẫu trước tiên, bạn có thể override Artboard phần tiêu của nó hoặc chọn None để vô hiệu hóa nó.

Bí quyết ẩn và hiện Override

Chọn phiên bản chính của Image và dùng checkbox cạnh từng Override có sẵn trong bảng Handle Overrides trên Inspector để chọn thành phần có sẵn lúc chọn phiên bản Image phụ trên bất cứ đâu trong bản thiết kế.

Bí quyết thiết lập lại Override

Chọn phiên bản bất kỳ và click on vào icon reset cạnh tiêu đề bảng Override trong Inspector để xóa và thiết lập lại Override bất kỳ mà bạn đã ứng dụng cho nó.

Nút thiết lập lại các cài đặt override

Bí quyết tách 1 Image Occasion khỏi phiên bản chính

Để tiến hành chỉnh sửa 1 phiên bản Image mà ko dùng Overrides, bạn cần tách nó khỏi bản Grasp bằng phương pháp chọn Layer › Detach from Image từ menu. Bạn cũng có thể click on vào nó và chọn Detach from Image. Giữ phím Possibility thay đổi đổi lệnh sang Detach all contents from Image. Nó sẽ chuyển đổi Image này cùng những biểu tượng lồng nhau khác trong nó thành những nhóm.

Bí quyết hoán đổi Image

Bạn có thể hoán đổi Image bằng phương pháp dùng Elements Popover trong bản Image trên Inspector. Chọn Image từ danh sách hoặc kiếm tìm và click on để hoán đổi nó có biểu tượng lựa chọn hiện tại.

Bí quyết chỉnh tỉ lệ và thay đổi đổi kích thước Image

Bạn có thể chỉnh tỉ lệ và thay đổi đổi kích thước Image như lớp hoặc nhóm bất kỳ bằng lệnh Scale. Chọn Layer › Rework › Scale… (hoặc nhấn ⌘ + Ok). Tạo kiểu và những thuộc tính như đường viền sẽ nâng cao hoặc giảm tỷ lệ Image mà ko liên quan tới bản chính.

Xem Thêm  Những cách dùng công cụ Remodel đơn giản trong Photoshop

Sắp xếp Image

Bí quyết tạo nhóm biểu tượng

Để nhóm những Image lại cùng nhau trong Elements Panel và menu Insert, hãy đặt tên cho chúng theo định dạng: Group-name/Image-name. Dí dụ, 2 Symbols tên Button/Regular và Button/Pressed sẽ trở nên 1 phần của nhóm mang trong mình tên Button.

Lưu ý: Bạn sẽ cần có từ 2 Image trở lên trong 1 nhóm trước lúc chúng hiện trên menu phụ.

Sắp xếp những Image trong Bảng Elements

Bạn cũng có thể sắp xếp những Symbols qua Elements Panel. Chỉ cần click on đúp vào Image hoặc nhóm bất kỳ để đổi lại tên cho nó. Bạn có thể kéo và thả Symbols vào 1 nhóm hiện tại hoặc tạo nhóm new bằng phương pháp kéo Image lên phía trên biểu tượng khác.

Symbols trong Elements Panel được sắp xếp theo thứ tự động bảng chữ chiếc.

Dùng Symbols Web page

Gửi những bản chính Image vào trang Symbols có thể giúp cho mọi thứ ngăn nắp, đặc biệt hữu ích có những bản thiết kế phức tạp. Nó cũng giúp giảm sự lộn xộn giữa việc dùng Image bản chính hoặc phụ.

Để loại bỏ 1 bản chính Image theo phương pháp thủ công, hãy kéo nó vào tiêu đều trang Symbols trong Layer Listing hoặc click on biểu tượng đấy và chọn Ship lớn “Symbols” Web page.

Tạo những biểu tượng lồng nhau

Để tạo 1 Image lồng nhau, chèn 1 phiên bản Image vào bản chính trên trang Symbols. Ngay thời điểm hiện tại}, lúc chỉnh sửa bản chính của phiên bản Image đấy, nó sẽ cập nhật khắp mọi nơi, bao gồm những phiên bản bên trong những grasp Image khác.

Bạn cũng có thể tạo Image lồng nhau bằng phương pháp chọn từ 2 phiên bản Image trở lên và chọn Create Image trong thanh công cụ.

Lưu ý: Ko có giới hạn số lượng biểu tượng lồng nhau nhưng bạn ko thể dùng 1 phiên bản Image bên trong bản chính của nó.

Bí quyết dùng những Override biểu tượng lồng nhau

Để dùng những Image lồng nhau làm cho Override, bạn cần có từ 2 bản chính Image trở nên trên cùng kích thước và dùng 1 trong số chúng làm cho biểu tượng lồng nhau.

Lúc chọn 1 phiên bản Image trong thiết kế, bạn sẽ thấy tùy thuộc} chọn hoán đổi những biểu tượng lồng nhau có Image bất kỳ cùng kích thước khác. Điều này đặc biệt hữu ích lúc dùng menu chứa những nút bấm kích hoạt trạng thái.

Để nhanh chóng truy cập Image chính của 1 trong số những Override lồng nhau, click on icon mũi tên cạnh tên Image Override lồng nhau trong Inspector.

Chỉnh lại kích thước Image bằng Sensible Format

Sensible Format duy trì phần đệm và khoảng phương pháp giữa những lớp trong Image lúc 1 override thay đổi đổi kích thước của nó. Lúc đã thiết lập Sensible Format, thay đổi đổi override trong 1 phiên bản Image sẽ tự động động chỉnh lại kích thước của nó.

Để dùng Sensible Format, chỉ cần tạo biểu tượng và bố cục nó theo chiều ngang hoặc dọc. Lúc tạo 1 phiên bản cho Image đấy và chỉnh sửa những override, Sensible Format sẽ dùng khoảng phương pháp và phần đệm giữa những lớp trong Image chính làm cho bản thiết kế và giữ chúng nhất quán trong phiên bản từng lúc thay đổi đổi kích thước.

Bí quyết dùng Sensible Format có Symbols

Bạn có thể đặt những thuộc tính Sensible Format trong Inspector (lúc chỉnh sửa 1 grasp Image hiện có hoặc tạo 1 Image new).

Để dùng Sensible Format có Image hiện có, tới bản chính của nó (bạn có thể tới đấy nhanh chóng bằng phương pháp chọn occasion Image bất kỳ và nhấn Enter trên bàn phím) và chọn phương pháp muốn Sensible Format chỉnh lại kích thước của nó trong bảng Format trên Inspector.

Biểu tượng này được thiết lập chỉnh lại kích thước chiều ngang từ trung tâm

Ngoài việc chọn Image thay đổi đổi kích thước theo chiều ngang hoặc dọc, bạn cần đặt cả hướng muốn nó chỉnh từ đây (sắp giống như việc căn chỉnh textual content). Bạn có thể chọn từ những thuộc tính bố cục sau:

  • Vertical – Chiều dọc
    • Prime lớn Backside – Từ trên xuống
    • Backside lớn Prime – Từ dưới lên
    • From Center – Từ giữa
  • Horizontal – Chiều ngang
    • Left lớn Proper – Trái qua cần
    • Proper lớn Left – Buộc phải qua trái
    • From Middle – Từ trung tâm
Xem Thêm  Tổng hợp giftcode và cách nhập code FIFA On-line 4 2023

Lúc bạn tạo 1 Image new, bạn có thể thiết lập những thuộc tính sau bằng menu thả xuống trong trường tên trên bảng Create New Image.

Lưu ý: Lúc ứng dụng những thuộc tính Sensible Format vào 1 Image kèm những lớp textual content, bạn cần đảm bảo thiết lập tự động động chiều cao (bố cục màn hình dọc) hoặc chiều rộng (bố cục màn hình ngang) cho chúng. Sensible Format so sánh kích thước của lớp textual content đấy trong phiên bản Image chính có 1 biểu tượng trên phiên bản occasion để tiến hành chỉnh lại kích thước layer khác trong Image, vì thế, những lớp textual content kích thước cố định sẽ ko hoạt động bởi chúng luôn được giữ nguyên.

Lúc phân phối 1 thuộc tính Image Sensible Format, bạn sẽ thấy icon new cạnh tên của nó trong Layer Listing hiện hướng bố cục.

Tạo một nút bấm trong Sketch

Trường hợp thay đổi đổi bố cục grasp Image lúc nó đã có những thuộc tính Sensible Format, những phiên bản phụ của nó có thể ko còn chính xác. Để sửa lỗi này, hãy thử click on vào Shrink occasion lớn match content material button trong bảng Overrides trên Inspector.

Lưu ý: Bạn vẫn có thể ứng dụng Resizing Constraints vào những lớp trong 1 Image chứa thuộc tính Sensible Format. Hành động này hữu ích giả dụ muốn 1 layer nào đấy bỏ qua những cài đặt đã phân phối cho Image đấy. Dí dụ, bạn có thể dùng Resizing Constraints để sửa kích thước layer và ngăn nó thay đổi đổi tỉ lệ phiên bản Image phụ có bố cục theo chiều ngang hoặc dọc.

Bí quyết dùng nhiều thuộc tính Sensible Format trong 1 Image

Đối có những thành phần UI phức tạp, bạn có thể muốn bao gồm 1 bố cục theo chiều ngang thuộc diện bố cục chiều dọc như thí dụ bên dưới. Tại trường hợp này, bạn có thể ứng dụng những thuộc tính Sensible Format cho nhóm trong grasp Image để thay đổi đổi kích thước những bộ layer khác nhau theo nhiều hướng.

Để làm cho việc này, mở grasp Image, chọn đối tượng bạn muốn chỉnh lại kích thước theo nhiều hướng khác nhau và nhóm chúng lại. Giờ bạn có thể ứng dụng 1 bộ thuộc tính Sensible Format riêng lên nhóm đấy, nằm bên trong bảng Format trên Inspector. Giống như Symbols, bạn sẽ thấy 1 icon nhóm new tại Layer Listing hiện hướng bố trí của chúng.

Trường hợp có 1 Image mà 1 trong số những lớp chỉ chiều cao tối thiểu của Image (như ảnh trong card thí dụ bên dưới), ứng dụng 1 override lên lớp textual content ngắn hơn cạnh nó sẽ làm Image thay đổi đổi kích thước có phần đệm ko cần thiết. Trường hợp gặp cần trường hợp này bạn cần nhóm những lớp textual content và layer chỉ độ cao tối thiểu của Image trong bản biểu tượng chính. Sau thời điểm hoàn thành, bạn có thể ghi đè lớp textual content đấy và Sensible Format sẽ hiểu ko cần nâng cao chiều cao Image tổng thể cho tới lúc vượt qua chiều cao tối thiểu.

Bí quyết dùng Sensible Format có những Image ẩn

Sensible Format ko chỉ hoạt động lúc những override thay đổi đổi kích thước của 1 phiên bản Image, nó cũng hoạt động lúc bạn ẩn 1 Image. Để tính năng này hoạt động, bạn cần 1 bộ Image lồng nhau theo hướng bố cục chính của Image (thí dụ: 1 hàng những nút trong menu bố cục theo chiều ngang). Ẩn 1 trong số những Image này qua bảng Overrides sẽ làm những biểu tượng khác vận động lên phía trên và lấp đầy điểm trống. Điều này hoạt động có cả những Image có chiều cao & rộng khác nhau.

Menu điều hướng biểu tượng Symbol trong Sketch

Trên đây là chi tiết phương pháp dùng và tùy thuộc} biến biểu tượng trong Sketch. Hello vọng bài viết hữu ích có người sử dụng.