Blockly, ipuçları, içerik menüleri ve bloklardaki metinler gibi bir uygulamadaki metni yerelleştirmek için bir sistem sağlar. Bu sistemi kendi metnini yerelleştirmek için kullanır. Siz de uygulamanıza özgü metni yerelleştirmek için bu sistemi kullanabilirsiniz.
Not: Yerelleştirme, çeviriyle aynıdır. Tek farkı, çevirilerin farklı ülkelerde farklı olmasına izin vermesidir (ör. Portekiz ve Brezilya'da Portekizce için farklı çeviriler).
Yerelleştirme sisteminin işleyiş şekli
Yerelleştirme sistemi, yerelleştirme jetonlarından, yerelleştirme tablolarından ve jetonları yerelleştirilmiş dizelerle değiştirmek için tabloları kullanan işlevlerden oluşur.
Yerelleştirme jetonları
Yerelleştirme jetonu, yerelleştirilmesi gereken metni temsil eden kısa bir dizedir. Örneğin, özel bir tarih bloğundaki ipucu MY_DATE_TOOLTIP
jetonunu kullanabilir. Yerelleştirme jetonları, kodda metin yerine kullanılır. Blockly, çalışma zamanında bu jetonları yerelleştirilmiş dizelerle değiştirir.
Yerelleştirme tabloları
Dize tablosu veya mesaj tablosu olarak da bilinen yerelleştirme tablosu, yerelleştirme jetonlarını yerelleştirilmiş dizelerle eşleyen bir nesnedir. Her yerel ayar için farklı bir tabloya ihtiyacınız vardır. Örneğin, İngilizce ve İspanyolcayı desteklemek istiyorsanız İngilizce tablonuz şunları içerebilir:
enTable.MY_DATE_TOOLTIP = 'Enter a date.';
İspanyolca tablonuz şunu içerebilir:
esTable.MY_DATE_TOOLTIP = 'Introduzca una fecha.';
Blockly, kendi metni için yerelleştirme tabloları içerir. Bunlar, Blockly dağıtımında blockly/msg/xx.js
adlı dosyalar olarak bulunur. Burada xx
yerel ayar kodudur.
Kendi metniniz için yerelleştirme tabloları oluşturmanız gerekir. Çalışma zamanında, seçilen yerel ayar için yerelleştirme tablolarını (Blockly'nin ve sizinki) Blockly'nin dahili olarak kullandığı yerelleştirme tablosu olan Blockly.Msg
içine yüklersiniz.
Yerelleştirme sistemini kullanma
Yerelleştirme sistemini kullanmadan önce, kaç yerel dili desteklemek istediğinize ve gelecekte daha fazla yerel dili desteklemeyi planlayıp planlamadığınıza karar vermeniz gerekir.
Yalnızca tek bir yerel ayarı desteklemek istiyorsanız metninizi doğrudan kodunuza girin. Yerelleştirme jetonları kullanmanıza gerek yoktur.
- Yerel ayarınız İngilizce (
en
) ise başka bir işlem yapmanız gerekmez.en
yerel ayarı için Blockly yerelleştirme tablosu varsayılan olarak yüklenir. - Yerel ayarınız
en
değilse ilgili yerel ayar için Blockly yerelleştirme tablosunu yükleyin.
- Yerel ayarınız İngilizce (
Şu anda veya gelecekte birden fazla yerel ayarı desteklemek istiyorsanız:
- Özel metniniz için yerelleştirme jetonları tanımlayın ve kullanın.
- Kullanıcıların yerel ayarı nasıl seçeceğine karar verin.
- Yerel ayar için Blockly yerelleştirme tablosunu yükleyin.
- Yerel ayar için yerelleştirme tablonuzu yükleyin.
Yerelleştirme jetonlarını tanımlama ve kullanma
Birden fazla yerel ayarı desteklerken tüm özel metinlerinizde yerelleştirme jetonlarını tanımlamanız ve kullanmanız gerekir.
Yerelleştirme jetonlarını tanımlama
Yerelleştirilmesi gereken her dize için bir jeton tanımlayın. Blockly'nin gelecekte ekleyeceği jetonlarla çakışmayı önlemek için jetonlarınızda özel bir ön ek kullanmak isteyebilirsiniz.
Örneğin, tek bir özel blok ve tek bir özel kategoriniz varsa aşağıdaki jetonları tanımlayabilirsiniz:
MY_DATE_BLOCK_TEXT
MY_DATE_TOOLTIP
MY_DATE_HELPURL
MY_DATE_CATEGORY
Yerelleştirme tablolarını tanımlama
Desteklemek istediğiniz her yerel ayar için bir yerelleştirme tablosu tanımlayın. Örneğin:
// English localization table: my_tokens_en.js
export const myEnTable = {
MY_DATE_BLOCK_TEXT: 'Date %1',
MY_DATE_TOOLTIP: 'Enter a date.',
MY_DATE_HELPURL: 'https://myownpersonaldomain.com/help/en/dateblock'
MY_DATE_CATEGORY: 'Dates',
}
// Spanish localization table: my_tokens_es.js
export const myEsTable = {
MY_DATE_BLOCK_TEXT: 'Fecha %1',
MY_DATE_TOOLTIP: 'Introduzca una fecha.',
MY_DATE_HELPURL: 'https://myownpersonaldomain.com/help/es/dateblock'
MY_DATE_CATEGORY: 'Fechas',
}
JSON'da yerelleştirme jetonlarını kullanma
JSON'da yerelleştirme jetonlarını kullanmak için yerelleştirilecek dizeyi jeton referansıyla değiştirin. Jeton referansı %{BKY_TOKEN}
biçimindedir. Örneğin:
Blockly.common.defineBlocksWithJsonArray([{
type: 'my_date',
message0: '%{BKY_MY_DATE_BLOCK_TEXT}',
args0: [
{
type: 'field_input',
name: 'DATE',
}
],
output: 'Date',
colour: '%{BKY_MY_DATE_COLOUR}',
tooltip: '%{BKY_MY_DATE_TOOLTIP}',
helpUrl: '%{BKY_MY_DATE_HELPURL}',
extensions: ['validate_date'],
}]);
JSON işlenirken (bu durumda, blok oluşturulurken) Blockly, Blockly.Msg
içindeki jetonları arar ve bunları yerelleştirilmiş dizelerle değiştirir. Jeton bulunamazsa referans yerinde bırakılır ve bir uyarı gösterilir.
Jeton referanslarının kullanılabileceği yerlerin tam listesi için ek bölümüne bakın.
JSON mesajı kesme
JSON blok tanımındaki message
anahtarları, bir bloktaki girişleri ve alanları (etiketler dahil) tanımlar. Bu anahtarlarda jeton referanslarının kullanılması, tek bir blok tanımının birden fazla yerel ayarın kelime dağarcığına, kelime sıralamasına ve yönüne uyum sağlamasına olanak tanır. Örneğin, Blockly'nin lists_repeat
bloğu dört farklı dilde aşağıda verilmiştir:
Bu blokların tümü aynı blok tanımını paylaşır. Bu tanımın message0
anahtarı şunlardır:
message0: %{BKY_LISTS_REPEAT_TITLE},
Bu jetonun İngilizce yerelleştirme tablosundaki değeri:
Blockly.Msg['LISTS_REPEAT_TITLE'] = 'create list with item %1 repeated %2 times';
Aralıklarla yerleştirme işaretçileri (%1
ve %2
), bloğun tanımlanmış girişlerine ve alanlarına karşılık gelir. İşaretçiler arasındaki metin, adlandırılmamış etiket alanlarına dönüştürülür. message0
metni, blok tanımında değil yerelleştirme tablolarında depolandığından JSON'daki tek bir blok tanımı, girişlerin ve alanların farklı sıralamalarını destekleyebilir:
// In Spanish: label, input, label, input, label
Blockly.Msg['LISTS_REPEAT_TITLE'] = "crear lista con el elemento %1 repetido %2 veces";
// In Korean: input, label, input, label, input (dummy)
Blockly.Msg['LISTS_REPEAT_TITLE'] = "%1을 %2번 넣어, 리스트 생성";
Bu, JavaScript'teki blok tanımları için mümkün değildir. Burada, giriş ve alanların farklı sıralanmaları farklı işlev çağrısı sıraları gerektirir.
Sağdan sola yazılan dilleri kullanırken mesaj dizesini görsel sırayla yazın ve Unicode yön komutları eklemeyin:
// In Arabic. Note how %2 is left of %1, since it reads right to left.
Blockly.Msg['LISTS_REPEAT_TITLE'] = "إنشئ قائمة مع العنصر %1 %2 مرات";
Blockly'nin message
anahtarlarını girişlere ve alanlara nasıl dönüştürdüğü hakkında daha fazla bilgi için JSON'da blok yapısını tanımlama başlıklı makaleyi inceleyin.
JavaScript'te yerelleştirme jetonlarını kullanma
JavaScript'te yerelleştirme jetonlarını kullanmak için yerelleştirilecek dizeyi Blockly.Msg['TOKEN']
ile değiştirin. Örneğin:
// Return the text for a localized context menu item.
displayText: () => Blockly.Msg['MY_CONTEXT_MENU_ITEM'];
Blockly, ek bölümünde belirtilmeyen durumlar dışında JavaScript'teki jeton referanslarını ayrıştırmaz:
// Doesn't work. Returns '%{BKY_MY_CONTEXT_MENU_ITEM}'.
displayText: () => '%{BKY_MY_CONTEXT_MENU_ITEM}';
Yerel ayar seçin
Yerel ayar seçimi uygulamaya özeldir ve Blockly'nin kapsamı dışındadır. Örneğin, uygulamanız her zaman aynı yerel ayarı kullanabilir, yerel ayarı URL'den veya URL parametrelerinden belirleyebilir ya da kullanıcıların bir listeden yerel ayar seçmesine izin verebilir.
Genel kural olarak, çalışma alanı oluşturmadan önce bir yerel ayar seçmeniz ve ilgili yerelleştirme tablolarını yüklemeniz gerekir. Bir çalışma alanı oluşturduktan sonra farklı bir yerel ayar seçip yeni tablolar yüklerseniz çalışma alanını yeniden oluşturmanız gerekir: Blockly, mevcut araç kutusunu veya blokları yeni yerel ayarı otomatik olarak kullanacak şekilde güncellemez. Kullanıcının çalışmalarını (varsa) korumak için çalışma alanını yeniden oluşturmadan önce durumu kaydedin ve ardından yeniden yükleyin.
Blockly yerelleştirme tablosu yükleme
Blockly, yerleşik bloklardaki metinler gibi kendi metninin tamamı için yerelleştirme tabloları sağlar. Varsayılan olarak yüklenen en
yerel ayarını kullanmıyorsanız yerel ayarınız için Blockly yerelleştirme tablosunu yüklemeniz gerekir.
Blockly'nin yerelleştirme tabloları, xx
yerel ayar kodu olan blockly/msg/xx.js
adlı dosyalarda depolanır. Desteklenen yerel ayarların listesi için blockly/msg/json
içindeki dosyaları inceleyin.
npm ile Blockly yerelleştirme tablosu yükleme
Blockly'yi import * as Blockly from 'blockly';
ile içe aktardığınızda varsayılan modülleri alırsınız: Blockly çekirdeği, Blockly yerleşik blokları, JavaScript oluşturucu ve İngilizce (en
) yerel ayarı için Blockly yerelleştirme tablosu.
npm kullanarak farklı bir yerel ayar için Blockly yerelleştirme tablosunu yüklemek üzere:
Blockly varsayılan modüllerini içe aktarma:
import * as Blockly from 'blockly/core'; import 'blockly/blocks'; import 'blockly/javascript'; // Or the generator of your choice
Yerel ayarınız için Blockly yerelleştirme tablosunu içe aktarın. Örneğin, İspanyolca (
es
) yerel ayarı için tabloyu içe aktarmak istiyorsanız:import * as Es from 'blockly/msg/es';
Tabloyu
Blockly.setLocale
ile yükleyin. Bu işlev, tabloyuBlockly.Msg
nesnesine kopyalar.Blockly.setLocale(Es);
setLocale
yalnızca Blockly'nin npm sürümüne dahildir.
npm olmadan Blockly yerelleştirme tablosu yükleme
npm kullanmadan bir Blockly yerelleştirme tablosu yüklemek için tabloyu msg
dizininden yüklemek üzere <script>
etiketi kullanın. Örneğin:
<script src="../../blockly_compressed.js"></script>
<script src="../../blocks_compressed.js"></script>
<script src="../../msg/es.js"></script>
Yerelleştirme tablosu otomatik olarak yüklenir.
Kendi yerelleştirme tablonuzu yükleme
Kendi yerelleştirme tablolarınızı tanımlarsanız seçtiğiniz yerel ayar için tabloyu yüklemeniz gerekir.
npm kullanıyorsanız bunu
Blockly.setLocale
ile yapabilirsiniz:import * as Es from 'blockly/msg/es'; import {myEsTable} from '../my_tokens_es'; Blockly.setLocale(Es); Blockly.setLocale(myEsTable);
setLocale
, giriş nesnesinden her anahtar/değer çiftiniBlockly.Msg
içine kopyalar. Farklı anahtarlarla birden çok kez çağırabilirsiniz ancak aynı anahtarla ikinci kez çağırdığınızda ilk çağrının üzerine yazılır.npm kullanmıyorsanız tablonuzu
Blockly.Msg
'e manuel olarak kopyalamanız gerekir. (setLocale
yalnızca Blockly'nin npm sürümüne dahildir.) Bunu yapmanın en kolay yolu,setLocale
için kendi sürümünüzü tanımlamaktır.function mySetLocale(locale) { Object.keys(locale).forEach(function (k) { Blockly.Msg[k] = locale[k]; } } mySetLocale(myEsTable);
Jeton referanslarını çözen işlevler
Blockly, jeton referanslarını çözmek için iki işlev sağlar:
Blockly.utils.parsing.replaceMessageReferences
(genellikle kullanılır) ve
Blockly.utils.parsing.tokenizeInterpolation
(nadiren kullanılır). Çoğu durumda bu işlevlerden herhangi birini çağırmanız gerekmez. Bunun nedeni, Blockly'nin token referanslarını desteklediği yerlerde bunları zaten çağırmasıdır. Örneğin, Blockly, JSON blok tanımındaki messageN
, tooltip
ve helpUrl
anahtarlarındaki jeton referanslarını çözmek için bu işlevleri kullanır.
replaceMessageReferences
değerini kullanmanız gerekebilecek yerlerden biri özel alanlardır.
Özel alanınız, seçeneklerinden herhangi birinde jeton referanslarını kabul ediyorsa bunları çözmek için replaceMessageReferences
simgesini kullanın. Daha fazla bilgi için JSON ve kayıt başlıklı makaleyi inceleyin.
İlgili konular
- Sağdan sola doğru yazılan diller: RTL demosuna bakın.
- Blockly'nin metnini yerelleştirmeye yardımcı olun: Blockly'ye katkıda bulunmayla ilgili bölümde Çeviri'ye bakın.
Ek: Jeton referanslarına izin verilen yerler
Aşağıdaki JSON anahtarlarında jeton referansları kullanabilirsiniz:
- Kategori araç kutusu tanımlarında:
name
colour
- Blok tanımlarında:
messageN
tooltip
helpUrl
colour
- Tüm alanlara iletilen seçeneklerde:
tooltip
field_dropdown
içindeoptions
'ye iletilen iç içe yerleştirilmiş dizilerde:- İlk öğe bir dize olduğunda ilk öğe
- İlk öğe bir resmi tanımlayan bir nesne olduğunda
alt
değerini
field_variable
parametresine iletilen seçeneklerde:variable
field_label
vefield_label_serializable
'a iletilen seçeneklerde:text
field_image
parametresine iletilen seçeneklerde:height
width
src
alt
- Temalarda:
colour
kategori stillerinde- Blok stillerinde
colourPrimary
,colourSecondary
vecolourTertiary
Ayrıca aşağıdaki yöntemlerde bağımsız değişken değerleri olarak:
Block.setColour
Blockly.utils.extensions.buildTooltipForDropDown
Blockly.utils.extensions.buildTooltipWithFieldText
Blockly.utils.parsing.parseBlockColour
Araç kutusunun XML tanımında, <category>
aşağıdaki özelliklerinde:
name
colour
Renk değeri olarak jeton referansları kullanma hakkında daha fazla bilgi için Renk referansları bölümüne bakın.