37 replies to this topic

[Manuel777]

• Title: Item list example for mobile devices
• Description: This was made to replicate most item lists on mobile devices, inside GM
• GM Version: GameMaker:Studio (Android, iOS, Mac, PC, HTML5)
• Registered: Yes (Studio has no lite) heh.
• File Type: .gmz
• File Size: ~350Kb
• File Link: [Dropbox] ItemList.gmz
• Required Extensions: None
• Required DLLs: None
• Tags: items, list, android, ios,

Summary
This tutorial provides the basics to create item lists for mobile devices; Here's a brief list of its features:

• Simple to edit and modify for you own needs.
• It addapts to multiple screens and supports auto-rotation.
• You can add sprites, text, anything you want to each item.
• Bundled on a single object.
• Sidebar w/alpha.
• Friction on drag.

I'll be happy to answer any question, i made this for my own needs but ended up using it so much I wanted to share it, so I tried to add as many comments as I could so you guys can understand it 100%!

Enjoy!


Note: To import the .gmz on your project, go to the 'import' tab when starting GameMaker:Studio and select the location where you have downloaded the file!

Edited by Manuel777, 10 September 2012 - 04:07 AM.

[Nocturne]

What can I say? Nice... .

[@Alex@]

This is pretty nice.

[Exe_Mas]

Awesome Manuel!!

[Lordfef]

very nice work!

Can i ask you an example to insert sprite in each row of the list?

thank's

[Manuel777]

Yeah sure, on the draw event, inside the for() loop there are several anotations, find the following lines:

// Draw the text corresponding to this item
    draw_text(view_xview+96, yy+48, txt[i]);
    // Here you can draw anything you want for this item, even sprites or animations

There you should include the draw_sprite() or whatever code you user for drawing, using the coordinates as shown above, for example:

    draw_text(view_xview+96, yy+48, txt[i]);
    draw_sprite(sprite_index, image_index, view_xview+48, yy+48);

And replacing the sprite_index and image_index to suit your needs of couurse

Edited by Manuel777, 18 September 2012 - 05:56 PM.

[Lordfef]

Thank you so much.

I have now another question. What is the better way to import this project in my game? Copy manually each piece or another way?

[shredded.carrot]

Can this be used to scroll the view instead? I am having trouble working this out...

[Manuel777]

I have now another question. What is the better way to import this project in my game? Copy manually each piece or another way?

No idea.. GM:S import feature never really worked for me that way

Can this be used to scroll the view instead? I am having trouble working this out...

I guess it could, you'll need to assign view_yview = offset anddraw everything correctly.. basically the only piece of code you could use from the example is the step event.

Edited by Manuel777, 25 September 2012 - 06:18 AM.

[Lordfef]

hi, in my room 640x960 i have a banner on the top (0,0>640,100) and a banner at the bottom (0,860>640,960).

Can you tell me how to set your item list, so it is contained between my two banner?

Thank's

[shredded.carrot]

I have now another question. What is the better way to import this project in my game? Copy manually each piece or another way?

No idea.. GM:S import feature never really worked for me that way

Can this be used to scroll the view instead? I am having trouble working this out...

I guess it could, you'll need to assign view_yview = offset anddraw everything correctly.. basically the only piece of code you could use from the example is the step event.

It's alright I redid the way I was thinking about scrolling. I'm using this system now

[proon]

Imagine that i draw 6 different sprites, and each sprite goes to different rooms, how do i do that?

*SOLVED*

Edited by proon, 06 December 2012 - 02:48 PM.

[raphaelle]

Hey mr. creator of this program, i found a bug, and Im workin on it, unfortunately 6hrs had passed and I still can't figure it out. thanks

the bug is when you scroll, and click the banner the button that is inside the banner will still be clicked,

hope somebody would me, im sure this post is here for months but please, help me outta here... :D thanks

if you don't understand the problem, ill explain it further. :D

-raphaelle

[Manuel777]

Hey mr. creator of this program, i found a bug, and Im workin on it, unfortunately 6hrs had passed and I still can't figure it out. thanks

the bug is when you scroll, and click the banner the button that is inside the banner will still be clicked,

hope somebody would me, im sure this post is here for months but please, help me outta here... :D thanks

if you don't understand the problem, ill explain it further. :D

-raphaelle

Simple, find this lines on the controller_obj draw event:

// Check if we tapped with less than 10px of drag
    if (point_distance(pressed, 0, released, 0) < 10) {
        selected_item = i;
        released = -99999;
    }

and replace it with this:

// Check if we tapped with less than 10px of drag
    if (point_distance(pressed, 0, released, 0) < 10 && mouse_y > banner_height) {
        selected_item = i;
        released = -99999;
    }

What I changed there is the 'if', I just added a statement to check that the mouse is below the banner_height (mouse_y > banner_height)
BTW; '&&' is the same as writing 'and', it means that the 'if' statement will be true as long as both statements are true

[raphaelle]

Hey mr. creator of this program, i found a bug, and Im workin on it, unfortunately 6hrs had passed and I still can't figure it out. thanks

the bug is when you scroll, and click the banner the button that is inside the banner will still be clicked,

hope somebody would me, im sure this post is here for months but please, help me outta here... :D thanks

if you don't understand the problem, ill explain it further. :D

-raphaelle

Simple, find this lines on the controller_obj draw event:

// Check if we tapped with less than 10px of drag
    if (point_distance(pressed, 0, released, 0) < 10) {
        selected_item = i;
        released = -99999;
    }

and replace it with this:

// Check if we tapped with less than 10px of drag
    if (point_distance(pressed, 0, released, 0) < 10 && mouse_y > banner_height) {
        selected_item = i;
        released = -99999;
    }

What I changed there is the 'if', I just added a statement to check that the mouse is below the banner_height (mouse_y > banner_height)
BTW; '&&' is the same as writing 'and', it means that the 'if' statement will be true as long as both statements are true />

hey thanks for the update, never thought that way....

thanks. great work anyway... :D

-raphaelle

[victorrseloy]

Wow this is perfect. thanks for sharing it Manuel.

[frifrafrank]

How could I do if I want a horizontal list?
Thanks!!!

[rgutierrez1014]

Bump, I would like to use this code, but for a horizontal menu. Would I just switch everything that says "y" or "height" or "view_yview" to "x" or "width" or stuff like that?

[Manuel777]

Bump, I would like to use this code, but for a horizontal menu. Would I just switch everything that says "y" or "height" or "view_yview" to "x" or "width" or stuff like that?

Yeah, exactly, trough you might have to change practically everything

[7ravenstudios]

Hi,

do you think is difficult to move all in a popup window object ? I mean i would like to use it to create an in-app menu that should appear up to the game in a portion of the screen, like in a object.
I also not understood how to add icons before the text.

If you can help i really appreciate.

Thanks.