J'essaie de faire une visionneuse d'images que lorsque l'utilisateur clique sur l'image, l'image est "recadrée" et révéler l'image complète.
Par exemple, dans la capture d'écran sous l'utilisateur ne voit que la partie du chiot initialement. Mais une fois que l'utilisateur a cliqué sur l'image, tout le chiot est révélé. L'image s'est évanouie derrière la première montre ce que les résultats de l'animation seraient. P>
P>
Initialement, l'imageView est à l'échelle de 50% sur X et Y. et lorsque l'utilisateur clique sur l'image, l'imageView est à l'échelle de l'image à 100% et la matrice ImageView est recalculée. P>
J'ai essayé tout type de moyen de calculer la matrice. Mais je ne peux pas sembler en trouver un qui fonctionne avec tout type de culture et d'image: Paysage recadré au portrait, paysage recadré au paysage, portrait recadré au portrait et portrait recadré au paysage. Est-ce même possible? P>
Voici mon code en ce moment. J'essaie de trouver ce qu'il faut mettre dans modifier: il convient de mentionner que la matrice sera la matrice linéairement ne pas faire. L'imageView est mis à l'échelle linéairement (0,5 à 1). Mais si j'éplève la matrice linéairement pendant l'animation, la vue est écrasée pendant l'animation. Le résultat final a l'air bien, mais l'image a l'air laide pendant l'animation. P> p> setimageecrop () code>. P>
4 Réponses :
Cela pourrait aider ... Vue d'image Android Échelle de matrice + Traduire
Il semble y avoir deux opérations Nécessaire: p>
Je suppose que c'est aussi simple que p> à échelle / zoom du centre de l'image, vous pourriez avoir besoin de faire quelque chose comme ça (peut-être échanger "-" commande) ... p> Je ne suis pas certain si cela va animer ( Pourquoi appeler SetScalex pendant Pinch Zoom Gesture cause un scintillement? ). Peut-être que cela aidera ... http://developer.android.com/training/animation /zoom.html p> Le résultat est que l'image interne reste la même résolution, toujours. P> Cependant, vous mentionnez également des différences de portrait / paysage, donc cela fait donc un peu plus compliqué. Je trouve la chose la plus difficile dans des cas tels que ceci est de définir solidement ce que vous voulez avoir lieu dans tous les cas. P> Je suppose que vous êtes après une grille de petites vignettes, tout de même taille (ce qui signifie qu'ils ont tous le même rapport d'aspect). Vous souhaitez afficher des images dans les conteneurs vignettes de différents rapports d'aspect et de taille, mais zoomé dans. Lorsque vous sélectionnez une image, les frontières se développent (chevauchement d'autres images?). Il y a la contrainte que l'image montrée doit conserver la même résolution. Vous mentionnez également que l'image complète doit être visible après la sélection de la taille et deux fois la taille de la vignette. Ce dernier point soulève une autre question - deux fois la hauteur, la largeur des vignettes ou les deux (dans quel cas récoltez-vous ou à l'échelle si le rapport d'image de l'image ne correspond pas). Un autre problème susceptible de cultiver est le cas lorsqu'une image a une résolution insuffisante. P> Espérons que Android peut faire beaucoup de cela pour vous ... Comment faire échec d'une image dans ImageView pour garder le rapport de format P> p>
J'ai édité ma question. Votre raisonnement est bon, mais entraînera une image «schémée» lors de l'animation. Mais merci d'avoir souligné les autres réponses Stackoverflow. Je vais regarder en eux. :)
Il semble étrange qu'une échelle uniforme écraserait l'image. Cela me fait remarquer à Android ne s'attendant pas à une matrice de mise à jour fréquemment (ou ne s'attend pas à ce qu'il soit en plus de mettre à jour la balance IMG). Que se passe-t-il si vous venez d'animer la matrice ou du conteneur individuellement? Peut-être qu'une approche plus directe consiste à attirer manuellement à une toile (cela vous donnerait certainement plus de contrôle explicite sur ce qui se passe et une meilleure performance optimale)?
L'animation Android fonctionne parfaitement. C'est vraiment une question mathématique. Je suis à l'échelle de l'imageView 1: 1 (l'imageView est échelonné de 0,5 à 1 sur l'axe X et Y), mais la matrice d'image a un rapport différent (3: 1 pour une image de paysage par exemple). Et je ne trouve pas la formule matricielle qui fonctionnerait pour chaque cas.
Est-ce que quelque chose sur les lignes de ce travail ... Float Aspecratio = TRUCLATECROPX / TRUCLATÉTRAPY; matrix.posscale (aspratio * zoom, zoom); Dire que l'image est écrasée pendant l'animation, mais pas avant et après suggère que cela ne fonctionnera pas. Peut-être que quelque chose comme ça est nécessaire ... Float Zoomx = 1,0f + Valeur * Quempleur; (juste une hypothèse)
Vous pouvez avoir un enfant ou par programme: p> suivant, ajoutez le et récupérez-le en utilisant p> ou , vous pouvez le créer programmatiquement: p> de toute façon, vous devrez le manipuler. Pour définir les limites code> ImageView CODE> pour dépasser son parent, vous pouvez le faire: P> voir code> d'un
groupe de visitement code> qui dépasse les limites du parent. Ainsi, par exemple, disons que la partie claire de votre image ci-dessus est la vue parent, et le
imageview code> est la vue enfant, puis nous devons simplement augmenter l'image. Pour ce faire, commencez par un
framelayout code> avec des limites spécifiques. Par exemple, dans
xml code>:
imageview enfant. Vous pouvez soit le déclarer dans
xml code>: p>
$.with(image).click(new Function() {
@Override
public void invoke($ droidQuery, Object... params) {
//scale down
if (image.getWidth() != parent.getWidth()) {
droidQuery.animate("{ width: " + parent.getWidth() + ", " +
"height: " + parent.getHeight() + ", " +
"x: " + Float.valueOf(ViewHelper.getX(parent)) + ", " +//needs to include a decimal in the string so droidQuery knows its a float.
"y: " + Float.valueOf(ViewHelper.getY(parent)) + //needs to include a decimal in the string so droidQuery knows its a float.
"}",
400,//or some other millisecond value for duration
$.Easing.LINEAR,//specify the interpolator
$.noop());//don't do anything when complete.
}
//scale up
else {
droidQuery.animate("{ width: " + parent.getWidth()*2 + ", " +
"height: " + parent.getHeight()*2 + ", " +
"x: " + x + ", " +//needs to include a decimal in the string so droidQuery knows its a float.
"y: " + y + //needs to include a decimal in the string so droidQuery knows its a float.
"}",
400,//or some other millisecond value for duration
$.Easing.LINEAR,//specify the interpolator
$.noop());//don't do anything when complete.
}
}
});
Je ne veux pas inclure de Framelayout autour de chaque imageView car cela affecterait les performances. Mais votre réponse affiche l'animation correctement.
@ Thierry-Dimitriroy Vous pouvez ajouter l'application Application Code> Attribute
Android: HardwareAscelerated = "true" code> dans votre
androidmanifest.xml code>, qui devrait prendre soin de votre problème de performance.
@ Thierry-Dimitriroy - En outre, je supposerais que d'autres solutions qui n'utilisent pas une vue parent ne seront effectivement plus préjudiciables à la performance, car elles incluaient des manipulations bitmap code> ou des graphiques avancés.
L'utilisation d'un parent pour l'animation réduirait la performance car elle nécessite une passe de mise en page. En mettant en scène le bitmap, la manipulation est effectuée sur le GPU pendant l'animation.
Essayez avec ce
Je me rends compte que vous (et les autres réponses) tentent de résoudre ce problème à l'aide de la manipulation de matrice, mais j'aimerais proposer une approche différente avec le même effet visuel que décrit dans votre question.
à la réserve de Utilisation d'une matrice pour manipuler sur une zone visible de l'image (vue), pourquoi ne pas définir cette zone visible en termes de coupant em>? Il s'agit d'un problème assez simple à résoudre: tout ce que nous avons à faire est de définir le rectangle visible et de ne pas tenir compte de tout contenu qui tombe en dehors de ses limites. Si nous anime ensuite ces limites, l'effet visuel est comme si la culture limite l'échelle de haut en bas. P> Heureusement, un Si vous jetez tout ensemble dans une simple extension d'un CANVAS CODE>
prend en charge la découpage via une variété de Clip * () Code> Méthodes pour nous aider ici. L'animation des limites de coupure est facile et peut être faite de la même manière que dans votre propre code de code. P>
imageview code> (pour l'incitation de l'encapsulation), vous obtiendrez quelque chose qui regarde ceci: P>
<mh.so.img.ClippingImageView
android:id="@+id/img"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/dog" />
Ainsi, l'image devient-elle plus grande (comme l'image) ou l'image vient-elle de zoomer pour afficher l'image entière, tout en conservant les mêmes limites?
@Phil Les échelles ImageView de 0,5 à 1. Il conserve la même mise en page liée.