2013-08-15 12 views
5

Wpadłem na ten problem podczas niedawnego projektu, gdy goście z działu graficznego zauważyli pogorszenie jakości obrazu. Nie jestem pewien, co jest przyczyną tego problemu, ale udało nam się rozwiązać problem, usuwając ScrollView, w którym był zagnieżdżony. Ale to nie jest realistyczne rozwiązanie, ponieważ będziemy potrzebować zagnieżdżać obrazy w widokach zagnieżdżonych w scrollviews.Zagnieżdżanie widoków pogarsza jakość obrazu

Mój kod wyglądał mniej więcej tak:

<View> 
    <ScrollView> 
     <View> 
       <ImageView image="someImage.png" /> 
     </View> 
    </ScrollView> 
</View> 

Kiedy usunęliśmy ImageView zarówno z zagnieżdżonego Scrollview i jest bezpośrednio dominującym go zobaczyć czyni dobrze. Stworzyłem repozytorium z prostym projektem ilustrującym to. Efekt stępienia jest najbardziej zauważalny na kolorowanie liter, biały cień na tekście i rozmycie szarej granicy.

https://bitbucket.org/bwellons/blurry-images

Jest to błąd, który wymaga raportowania czy istnieje dokumentacja gdzieś, że mówi „nie rób tego w ten sposób”, że nie wiem o?

Pozdrowienia Brant

+0

Witam Brant, link do Twojego obrazu na bitbucket wydaje się martwy. – svenv

+0

Również nie jestem zaznajomiony z tytanem, ale dla mnie brzmi to, że z jakiegoś powodu te kontrolki skalują obraz. Czy zmierzyłeś dokładny rozmiar obrazu w pikselach między dwoma scenariuszami opisanymi powyżej? Czy istnieje różnica? – svenv

+0

Poprawiłem link, usuwając .git z nazwy repozytorium. Teraz powinno działać. – Brant

Odpowiedz

2

myślę, że to jest spowodowane nie definiując granice (szerokość, wysokość) i kotwice (górny, lewy, prawy i dolny) poglądów w spójny sposób, na przykład, jeśli tylko zmiana to:

".parent": { 
    width: '100%', 
    height : 59, 
} 

do tego:

".parent": { 
    top : 0, 
    width: '100%', 
    height : 59 
} 

zatarcie odchodzi. Myślę, że tak się dzieje, ponieważ mieszane są względne i bezwzględne techniki rozmieszczania widoków (procenty i absolutne piksele) w ściśle związanym polu (widok .parent jest dokładnie taką samą wysokością, jak widok podrzędnego obrazu), co powoduje, że obliczenia układu pod fudge trochę, gdy narysują obraz w widoku rodzica.

Mówię to, bo to działa również zauważalnie wyeliminować rozmycie, umożliwiając więcej miejsca na błędy transformacji:

".parent": { 
    width: '100%', 
    height : 62 // Added 3 pixels of padding 
} 

Oto kilka innych metod, które pracują, jak również, by zarówno przy użyciu tego samego mechanizmu układ dla wysokość i szerokość, lub dając więcej miejsca dla transformat:

".parent": { 
    width: '100%', 
    height : '50%' // Dont do this, but shows the point 
} 

".parent": { 
    bottom : 0, 
    width: Ti.UI.FILL, // I use Ti.UI.FILL instead of 100% generally 
    height : 59 
} 

Więc ogólnie, z dala od mieszania procenty i wartości bezwzględne w gniazdowania widok łańcuchów wymiarów, chyba że jesteś gotów, aby dać pewną manewru w rodzica, lub zdefiniuj kotwice (góra, lewo, prawo, dół), aby przekształcić transformacje rysunkowe.

Zrzeczenie się: Opieram to stwierdzenie na około 15-20 różnych testach z ograniczonym układem i moich własnych doświadczeniach (nie miałem jeszcze kodu natywnego), więc nie jest to nauka.

Powiązane problemy