Condivisione della tecnologia

soluzione di adattamento uniapp

2024-07-12

한어Русский языкEnglishFrançaisIndonesianSanskrit日本語DeutschPortuguêsΕλληνικάespañolItalianoSuomalainenLatina

Le esclusive e potenti unità adattive upx e rpx di uni-app non possono essere assegnate dinamicamente alle soluzioni...

uni-app utilizza upx come unità di dimensione predefinita. upx è un'unità relativa alla larghezza di base e può essere adattata in base alla larghezza dello schermo. uni-app specifica la larghezza della base dello schermo 750upx.

Gli sviluppatori possono calcolare il valore upx degli elementi della pagina attraverso la larghezza di base della bozza di progetto. La formula di conversione tra 1px della bozza di progetto e 1upx dello stile di cornice è la seguente:
Bozza di progetto 1px / Larghezza base bozza di progetto = Stile cornice 1upx / 750upx

Per esempio:
Se la larghezza della bozza di progetto è 640 px e la larghezza dell'elemento A sulla bozza di progetto è 100 px, la larghezza dell'elemento A in uni-app deve essere impostata su: 750 *100 / 640 e il risultato è: 117upx.
Se la larghezza della bozza di progetto è 375 px e la larghezza dell'elemento B sulla bozza di progetto è 200 px, la larghezza dell'elemento B in uni-app deve essere impostata su: 750 * 200 / 375 e il risultato è: 400upx.

Come mostrato di seguito, la larghezza della bozza di progetto è 1920

Inserisci qui la descrizione dell'immagine
------Secondo la formula设计稿宽度 / 750 = 比率 Quindi 1920/750=2,56 Calcola la percentuale standard 750 della bozza di progettazione della larghezza del 1920 ------

Per comodità, fare clic su Hbuilder X工具>设置>语言服务配置Scorri verso il basso e c'è un px in rpx/upx, inserisci il rapporto calcolato sopra

Inserisci qui la descrizione dell'immagine
effetto reale:

Inserisci qui la descrizione dell'immagine
In questo modo, la dimensione px inserita verrà automaticamente convertita nella dimensione upx corrispondente.

Basta scegliere upx