XML newslist with thumbnails

[herre]

Hello,

After reading for several months the posts on this excellent forum, this is now my first post. *woohoow*

I am making a new flash site myself, and I want to make a special xml-based scrolling news-list, that looks the same as on this website:

http://www.carldekeyzer.com/

For the list example I want to make, click on "skip intro" and in the menu, click on "books". What you see on the right side is the list I want to make.

I've learned a lot and made the same scrolling list as in this topic on the forum:

http://www.tek-tips.com/viewthread.cfm?qid=908402&page=1

But the difference with the one on

http://www.carldekeyzer.com/

is that (according to me), the carldekeyser-one is not made with the use of the scrollpane component. Every item in the list is only displayed with date and subject, and only 1 item at the time is displayed with date, subject, description, thumbnail (if available) and launch button (if available) in a bigger rectangle. Also the scrollbar on the right is fully customized (the two circles with the arrows in it), so I assume that those circular buttons are just "buttons" and no skinned scrollbar component. All the small items (date and description) are also buttons on there own, and when clicked, they are displayed in the rectangle... Pretty complexe hey? But this is the only way I want to make my list...

The problem is that I really don't have a clue on where to start. The only thing I have right now is a test xml-file on which I want to base the gallery on:

<list>
<item>
<date>
02/09/2005
</date>
<subject>
Test Subject
</subject>
<description>
This is a simple test description
</description>
<thumbnail>
thumbs/thumb1.jpg
</thumbnail>
<launch_link>

http://www.tek-tips.com

</launch_link>
<launch_target>
_blank
</launch_target>
<show_launch_button>
true
</show_launch_button>
<show_thumbnail>
true
</show_thumbnail>
</item>
...
</list>

Is there anyone who could give me some tips, or has -I don't think so- by accident made the same list I was hoping to make?

Kind regards,

Herre, the belgian guy.

 

[pixl8r]

Follow the tutorial in the post that you referenced above for creating the dataset and xml connector components. Create a "target" clip for the list (exported for Actionscript) and create another clip using the "text field" components for the data you want to show. Then create your button(s). On the buttons you can iterate through the dataset something like this:

on(release){
    datasetName.next();
    //or datasetName.previous();
}

Then you bind the value of your text fields to the dataset items (using the component inspector). That binding will always show the currently selected item.

Hope that helps!

Wow JT that almost looked like you knew what you were doing!

 

[herre]

Hello Pixl8r (and the rest of the forum),

Ik managed to do the following:

-I kept my fla-movie as simple as possible (no extra movies)
-I made labels for my description, date and subject fields, and a loader component for my thumbnail.
-I've put 2 buttons on the scene where I added your code
-With databinding I linked the xml-fields with the labels and loader

The code works just fine, I can navigate between the records! Whoohoow!

I've put the full project (FLA + thumbs + swf) in a zip file, so other people can also use it:

http://users.pandora.be/desmet/newslist_thumbs.zip

But, I want to make it now with the professional look (like on

http://www.carldekeyzer.com/

) :

How can I:

- add the effect that when pressed on the 'next' button or the 'previous' button, that my data slides upwards away or downwards away (preferably with some easing-effect (so that the old data scrolls away from within the grey rectangle and goes to the top and the new data comes from the bottom en slides upwards in the grey rectangle) ?
- add the functionality that under the grey rectangle I can see, is just a list of the date and subjects from the next items in the xml-file, and off course, the current item that is shown in the grey rectangle, is not visible in the smaller list ?

Feel free to modify my code or movie of that should make it easier to explain...

Kindly regards and already thankx for the above help.

Herre