Çoklu Aygıtlarda Yerel Sabit Düzen React

Question

Yerel görünümlerde temel görünümler, metinler, resimler ve düğmeler ile en az uygulamam var. Karşılaştığım sorun, birden çok cihaz için düzeni yönetiyor. Birden çok aygıt için aynı (orantılı) görünümü & yazı tipi boyutunu nasıl koruyabileceğime ilişkin öneriler (çoklu ekran çözünürlükleri ve ekran boyutları).

Görünüm: Ben her satır solda bir imaja sahiptir öğelerin bir liste görünümü istiyorsanız Örneğin, sağda ile 2 düğmeler bazı metin (yani alt alta flex-direction: 'column'), nasıl olabilir Bu 5 "cihaz yanı sıra 10" cihaz üzerinde iyi görünüyor mu? Düğmeleri ölçekliyorsak, düğmelerin bazı borderRadius olduğunu da göz önünde bulundurun, borderRadius değerinin de artırılması gerekir. Bunu nasıl başarabilirim?

Yazı Tipleri: PixelRatio.getFontScale() kullanmayı denedim, ancak bu yalnızca yazı tipine bağlı olarak yazı tipini ölçeklendiriyor (anladığım kadarıyla). Bunu kullanarak, daha düşük bir çözünürlüğe sahip bir 10 "cihazda daha yüksek çözünürlükte ve daha küçük bir 5" cihazda 12 büyüklüğünde bir fontun daha büyük görünmesini sağlar. Tepki yerel uygulamasında yazı tipi boyutlarını nasıl yönetebilirim?

Answer 1

PixelRatio.getFontScale()'a ek olarak pencerenin yüksekliğini ve genişliğini elde etmek için Dimensions API'sini kullanabilir ve bileşenlerinizi buna göre ölçeklendirebilirsiniz. Hem iOS hem de android üzerinde çalışan bir uygulama oluşturdum ve bunu genişlik + yükseklikleri ölçeklemek için kullanıyorum.

Ödeme bağlantı Dimensions @ Facebook - React Native

yani.

Dimensions.get('window').width; Dimensions.get('window').height;

size