หน้าแรก>แหล่งข้อมูลการสร้างเว็บไซต์>ดาวน์โหลดแบบอักษร
ดาวน์โหลด

Google Web Fonts - ภาพตัวอย่างของครอบครัวแบบอักษร

repo นี้มีรูปภาพที่เป็นตัวแทนของฟอนต์ Google ที่แตกต่างกันทั้งหมด เราต้องการสิ่งนี้สำหรับ stencil แอปของเราเนื่องจากเราอนุญาตให้ผู้ใช้ของเราค้นหาผ่าน Google Fonts (ผ่าน API ของพวกเขา) แต่เราต้องการ/ต้องการให้พวกเขามีตัวอย่างของตัวอักษรที่ดูเหมือน

เราสามารถโหลดแบบอักษรลงในหน่วยความจำแล้วแสดงให้เห็น แต่ก็ดูเหมือนจะไม่เหมาะ

บันทึก

หากคุณสนใจในสกรีนช็อตเวอร์ชันโฮสต์ที่คุณเห็นด้านล่าง (ช่วยให้ผู้ใช้ของคุณทริกเกอร์โมดอลและการคลิกปุ่มทำให้เกิดเหตุการณ์ที่มี URL ของไฟล์ woff2 ที่เกี่ยวข้อง) โปรดแจ้งให้เราทราบ: [email protected]

ภาพหน้าจอของวิธีที่แอปของเราใช้รูปภาพใน repo นี้:

ทำไมมีไฟล์มากมาย?

ในขณะที่ Google Fonts มีรูปแบบฟอนต์ที่แตกต่างกันหลายพันรายการ นี่เป็นเพราะ Google Fonts อัปเดตแบบอักษรจากรุ่นหนึ่งไปยังอีกรุ่นหนึ่ง (เช่น V5 ถึง V6) จากนั้นเราแสดงภาพอีกครั้งเพื่อให้แน่ใจว่าตัวอย่างที่เราแสดงให้เห็นว่าผู้ใช้ของเราถูกต้อง

ฉันตัดสินใจที่จะทิ้งไฟล์เหล่านั้นไว้ใน repo เพื่อประโยชน์ของลูกหลาน: คุณไม่มีทางรู้ว่าคนอื่นจะต้องการอะไร :)

ขนาด

ในขณะนี้ฉันแค่ให้ภาพตัวอย่างที่มีค่า font-size 48px ความกว้างเคารพความกว้างดั้งเดิมของแบบอักษร เพื่อให้แน่ใจว่ามีการแสดงผลที่คมชัดฉันขอแนะนำให้คุณใช้งาน Hardcode Thumb ตัวอย่างที่ความสูงสูงสุด 24px

การตั้งชื่อการประชุมของไฟล์:

สองตัวอย่าง: ABeeZee-400.v10.png และ Cabin-400italic.v10.png
รูปแบบค่อนข้างตรงไปตรงมา:

  • ชื่อตัวอักษร (ไม่ใช่ไฮเฟน, ตัวอักษรที่ไม่ใช่ตัวอักษรและที่ไม่ใช่ตัวอักษรจะถูกลบออก)
  • เส้นประ ( - )
  • น้ำหนักตัวอักษร
  • หากตัวอักษรเป็นรุ่นตัวเอียงหลังจากตัวอักษรคำว่า italic จะถูกเพิ่ม
  • หมายเลขเวอร์ชันนำหน้าด้วยตัวอักษร v

นิพจน์ทั่วไปที่ฉันใช้ในการตัดชื่อตัวละครคือ: /[^A-Za-z0-9-]/

ขยาย
ข้อมูลเพิ่มเติม
แอปที่เกี่ยวข้อง
แนะนำสำหรับคุณ
ข้อมูลที่เกี่ยวข้อง ทั้งหมด