CODEWITHSUNDEEP
androidandroid-recyclerviewstaggered-gridviewstaggeredgridlayoutstaggeredgridlayoutmanager
Nexussim Lements
Nexussim Lements

Reputation: 787

Android how can I achieve a arrow based layout?

I want to know how is possible to achieve a arrow-based layout like this :

enter image description here enter image description here enter image description here enter image description here

Any idea about what Layout is using this app in order to achieve that layout ? It seems like a kind of Staggered Grid Layout maybe ? Or maybe is using a library or a custom layout ? How can I achieve something similar ?

Upvotes: 3

Views: 366

Answers (1)

Vasili Fedotov
Vasili Fedotov

Reputation: 1171

so here is how I would do something like this.

I make a bunch of custom views.

custom view #1: PokemonView. This is a regular Constraint Layout or CardView that contains all the items to show the pokemon, and its name, and all the other stuff.

custom view #2 EvolutionPokeminView. this is a custom constraint layout that contains a PokemonView, and The Arrow ImageView (and TextView below), and helper methods to place the arrow in different directions.

for example: setArrowDirection(int direction) \direction is some kind of enum for all directions (top, topLeft, topRight.. etc

another helper method is setArrorPosition, setArrowPosition(int direction)

then you use the arrow direction method to set the correct arrow image into the arrowImageView, and you use the arrow position method to use ConstraintSet to programmatically set the correct position of the arrow in relation to the pokemon image.

after that, you prepare a few common layouts to use with different sets of data and populate them accordingly.

Things you'd need to know to make this approach work. How to Make a Custom View in Android. How to use ConstraintLayout effectively. How to use ConstraintSet to programmatically edit ConstraintLayout constraints.

Upvotes: 0

Related Questions