Horizontal List alignment of images

I have a horizontal list component that loads 10-12 images
(using a custom item renderer). The horizontal list is only wide
enough to display 4 images at a time, so therefore scrolling is
required to view all images.
Upon launch, I would like the horizontal list to start at the
left most image (item 0) and then you are required to scroll right
to continue viewing. At the moment, the horizontal list launches
and displays the four image in the middle of the list, rather than
"sticking" to the left.
So, for example, instead of the default view showing images
4, 5, 6 and 7...it launches with the first four images 1, 2, 3, 4
in view.
Is there a way to do this?

You can change the horizontalScrollPosition property at load
time.

Similar Messages

How to display a horizontal list of images

Hello everyone,
I am new to Flash Builder 4 and I am looking to display a horizontal list of images on my Flex Mobile Project (using Burrito Flash Builder). Can anyone recommend me what component that I should use?
I know the <s:List /> will display a Vertical list of items, but I am not sure what component to display a horizontal list of items.
Thanks in advance for any help,

Have you tried using HorizontalList?
Here is an example:
http://flex4fun.com/2010/11/30/flex4-horizontallist-example/

Another Drag and Drop from horizontal list to canvas problem

Hi,
This is vaguely similar to the this
topic
but I seem to have made things even more complicated.
Basic set up is a horizontal list that uses a custom
component itemrenderer to display a thumbnail and label:
<?xml version="1.0"?>

<mx:VBox xmlns:mx="
http://www.adobe.com/2006/mxml"
width="100" height="120" verticalAlign="top" verticalGap="3"
verticalScrollPolicy="off" horizontalAlign="center"
backgroundAlpha="0.0" alpha="1.0">
<mx:Image id="img" height="60" width="80"
source="assets/{data.file}" scaleContent="true"/>
<mx:Label text="{data.text}" fontWeight="bold"
width="100%" textAlign="center"/>
</mx:VBox>
The data is loaded up from an external XML file with this
sort of format:
<?xml version="1.0" encoding="UTF-8"?>
<thumbnails>
<thumb>
<file>thumb_image_1.jpg</file>
<text>Thumb 1</text>
<url>
http://www.blah.com</url>
<id>thumb1</id>
</thumb>
</thumbnails>
That's loaded up using the HTTPService and stored in a Model
thing.
I've got the dragging from the HL happening quite nicely and
it drops fine on to the canvas area, code all hack off from the
help files. The problem I'm having is finding out the data about
the item I've just dropped, I should at least be able to get the
source url for the thumbnail and the label text string, but I just
don't know how to get it. The call back I'm using looks like this:
private function doDragDrop(event:DragEvent,
target1:Canvas):void {
var vX:int = target1.mouseX;
var vY:int = target1.mouseY;
var vW:int = target1.width;
var vH:int = target1.height;
// follow variables give relative coordinate values so that
if window size is altered
// we don't have to do tricky calulations to reset rating
positions.
var vRx:Number = vX/vW;
var vRy:Number = vY/vH;
Alert.show(event.dragSource + " " + vX + " " + vY + " " +
vRx + " " + vRy, 'Mouse drop loc', mx.controls.Alert.OK);
I just don't know how to get the info out of the
event.dragSource.
Here's the full mxml:
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="
http://www.adobe.com/2006/mxml"
layout="absolute" creationComplete="srv.send()">
<mx:Script>
<![CDATA[
private function xmlLoaded():void {
thumbAC = srv.lastResult.thumbnails;
import mx.core.DragSource;
import mx.managers.DragManager;
import mx.events.*;
import mx.containers.Canvas;
import mx.controls.Alert;
// Called when the user clicks the mouse on either colored
canvas.
// Initializes the drag.
private function dragIt(event:MouseEvent, text:String,
format:String):void {
// Get the drag initiator component from the event object.
var dragInitiator:Canvas=Canvas(event.currentTarget);
// Called if the user dragged a proxy onto the drop target
canvas.
private function doDragEnter(event:DragEvent):void {
// Get the drop target component from the event object.
var dropTarget:Canvas=Canvas(event.currentTarget);
DragManager.acceptDragDrop(dropTarget);
// Called if the target accepts the dragged object and the
user
// releases the mouse button while over the canvas.
// Handles the dragDrop event for the List control.
private function doDragDrop(event:DragEvent,
target1:Canvas):void {
var vX:int = target1.mouseX;
var vY:int = target1.mouseY;
// follow variables give relative coordinate values so that
if window size is altered
// we don't have to do tricky calulations to reset rating
positions.
Alert.show(event.dragSource + " " + vX + " " + vY, 'Mouse
drop loc', mx.controls.Alert.OK);
]]>
</mx:Script>
<mx:HTTPService id="srv" url="assets/thumbnails.xml"
useProxy="false" result="xmlLoaded();"/>
<mx:Model id="thumbAC"/>
<mx:Panel height="160" layout="absolute" title="Thumbnail
Browser" cornerRadius="10" id="thumbScrollBrowser" bottom="10"
left="10" right="10">
<mx:HorizontalList x="0" y="10" width="100%"
height="110" id="thumbBrowser"
dataProvider="{thumbAC.thumb}"
dragEnabled="true" rollOverColor="#FFFFFF"
selectionColor="#ffffff" borderColor="#FFFFFF"
borderSides="0" borderStyle="none" alpha="1"
backgroundAlpha="1.0"
itemRenderer="Thumbnail">
</mx:HorizontalList>
</mx:Panel>

<mx:ArrayCollection id="wallAC"/>
<mx:Canvas id="myCanvas" backgroundColor="#ffffff"
cornerRadius="10"
borderStyle="solid"
dragEnter="doDragEnter(event);"
dragDrop="doDragDrop(event, myCanvas);" left="10" right="10"
top="10" bottom="180">
</mx:Canvas>
</mx:Application>
Thanks for any thoughts.
Cheers,
Rob

This in the drop handler should give you back the XML you
just dropped:
var getListData:XML=
evtDrag.dragSource.dataForFormat("items");

Displaying data from an XMl in horizontal list

Ok so here's the skinny:
I have this flex app that works fine
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="
http://www.adobe.com/2006/mxml"
layout="absolute" width="100%"
viewSourceURL="srcview/index.html">
<mx:Style source="source.css"/>
<mx:Image x="15" y="4" source="images/title.jpg"
width="210" height="65"/>
<mx:Image source="images/title1.jpg" id="image1"
horizontalAlign="right" verticalAlign="top" top="3" width="784"
height="58" x="241"/>
<mx:XML id="tempXML" source="
http://development.company.net/interface.php?username=user&password=pass&customer= customer&action=showopen&operation=defects&format=xml&critcal=both"
/>
<mx:XMLListCollection id="defectXMLList"
source="{tempXML.defect}" />
<mx:DataGrid id="dataGrid" dataProvider="{defectXMLList}"
width="1024" rowCount="{defectXMLList.length + 1}" x="0" y="62"
borderThickness="2" borderColor="#fda600" themeColor="#fda600"
alternatingItemColors="[#fda600, #ffffff]" cornerRadius="0"
color="#000000" borderStyle="none" alpha="0.73">
<mx:columns>
<mx:DataGridColumn id="assetCol" dataField="asset"
headerText="Asset:" />
<mx:DataGridColumn id="componentCol"
dataField="component" headerText="Component:" />
<mx:DataGridColumn id="conditionCol"
dataField="condition" headerText="Condition:" />
<mx:DataGridColumn id="ffdCol" dataField="ffd"
headerText="FFD:" />
<mx:DataGridColumn id="inspidCol" dataField="inspid"
headerText="Inspection ID:" />
<mx:DataGridColumn id="mileageCol" dataField="mileage"
headerText="Mileage:" />
</mx:columns>
</mx:DataGrid>
</mx:Application>
However they now want to just display the asset and not in a
data grid but as a horizontal list and I have tried and tried to
look for an effective example of this and how to make it work.
I have tried Horizontal List, Vertical List, HBox, and VBox
but all I want the thing to do for now is to just display data
Horizontally.
any help would be great

HorizontalList is what you're looking for. But that alone
won't do. You'll need to write a custom renderer.
Search in the Flex Build helper for how to implement custom
renderer. Essentially, each row that you see in the grid would be
passed to each element in the horizontal list and you can use any
<mxml> or actionscript based component as renderer.
here are some of the topics that will get you started:
Using Item Renderers and Item Editors
Working with item renderers
ATTA

Is there a way of aligning the images in iweb photoalbums other than have them be a square?I have them at same height and resolution but htere is a default that shrinks them and aligns them at the bottom.Thanks.

Is there a way of aligning the images in iweb photoalbums other than have them be a square?I have them at same height and resolution but htere is a default that shrinks them and aligns them at the bottom.Thanks.

So how did you do it?
by understand what iweb widgets do, in this case setting gridEntry widget's scalMode preference from fill to fit.
then reset the displayed image, so it fits in the display area even if it's portrait aspect.
however, i found some glitches in gridEntry widget that's quite strange... but all fix-able.
perhaps, iweb experts (whose had poked at my example) here can chime in.

How do i backup the list of load images automatically exceptions under Options- Content. I want to transfer to another comp without re-adding one at a time

How do i backup the list of load images automatically exceptions under Options->Content. I want to transfer to another comp without re-adding one at a time. EVen if there is no way to backup, what is the system file for Firefox that stores these, so i can transfer this file or open it in an XML or similar editor to copy them out?

The permissions.sqlite file stores 'allow' and 'block' exceptions for cookies, images, pop-up windows, and extensions (software) installation.
*http://kb.mozillazine.org/Profile_folder_-_Firefox
You can use this button to go to the Firefox profile folder:
*Help > Troubleshooting Information > Profile Directory: Show Folder
See also:
*https://support.mozilla.org/kb/Recovering+important+data+from+an+old+profile
*http://kb.mozillazine.org/Transferring_data_to_a_new_profile_-_Firefox

Generating a Movie File from a List of (JPEG) Images

Hi All!
I was trying this example:
Generating a Movie File from a List of (JPEG) Images
http://java.sun.com/products/java-media/jmf/2.1.1/solutions/JpegImagesToMovie.java
I was using the following command line with the following output:
root - /home/robertmarkbram/java/jmf/classes
$java JpegImagesToMovie -w 320 -h 240 -f 1\
-o file:///home/robertmarkbram/CoolCampus/media/jpgOut.mov\
file:///BigBrain3/pics/breakfast.jpg\
file:///BigBrain3/pics/eating.jpg\
file:///BigBrain3/pics/howto.jpg\
file:///BigBrain3/pics/jupiterp_cassini_full.jpg\
file:///BigBrain3/pics/jupiterp_cassini.jpg\
file:///BigBrain3/pics/spocamok.jpg- create processor for the image datasource ...
Setting the track format to: JPEG
- create DataSink for: file:///home/robertmarkbram/CoolCampus/media/jpgOut.mov
start processing...
- reading image file: file:///BigBrain3/pics/breakfast.jpg
- reading image file: file:///BigBrain3/pics/eating.jpg
- reading image file: file:///BigBrain3/pics/howto.jpg
- reading image file: file:///BigBrain3/pics/jupiterp_cassini_full.jpg
- reading image file: file:///BigBrain3/pics/jupiterp_cassini.jpg
- reading image file: file:///BigBrain3/pics/spocamok.jpg
Done reading all images.
java.lang.NullPointerException
at com.sun.media.multiplexer.video.QuicktimeMux.writeVideoSampleDescription(QuicktimeMux.java:936)
at com.sun.media.multiplexer.video.QuicktimeMux.writeSTSD(QuicktimeMux.java:925)
at com.sun.media.multiplexer.video.QuicktimeMux.writeSTBL(QuicktimeMux.java:905)
at com.sun.media.multiplexer.video.QuicktimeMux.writeMINF(QuicktimeMux.java:806)
at com.sun.media.multiplexer.video.QuicktimeMux.writeMDIA(QuicktimeMux.java:727)
at com.sun.media.multiplexer.video.QuicktimeMux.writeTRAK(QuicktimeMux.java:644)
at com.sun.media.multiplexer.video.QuicktimeMux.writeMOOV(QuicktimeMux.java:582)
at com.sun.media.multiplexer.video.QuicktimeMux.writeFooter(QuicktimeMux.java:519)
at com.sun.media.multiplexer.BasicMux.close(BasicMux.java:142)
at com.sun.media.BasicMuxModule.doClose(BasicMuxModule.java:172)
at com.sun.media.PlaybackEngine.doClose(PlaybackEngine.java:872)
at com.sun.media.BasicController.close(BasicController.java:261)
at com.sun.media.BasicPlayer.doClose(BasicPlayer.java:229)
at com.sun.media.BasicController.close(BasicController.java:261)
at JpegImagesToMovie.controllerUpdate(JpegImagesToMovie.java:215)
at com.sun.media.BasicController.dispatchEvent(BasicController.java:1254)
at com.sun.media.SendEventQueue.processEvent(BasicController.java:1286)
at com.sun.media.util.ThreadedEventQueue.dispatchEvents(ThreadedEventQueue.java:65)
at com.sun.media.util.ThreadedEventQueue.run(ThreadedEventQueue.java:92)
Can anyone tell me what this error message means?
Thanks for any advice!
Rob
:)

I think it does that for QuickTime if you don't define the lineStride value in the VideoFormat (lineStride = pixelStride * width).

Aligning an image within Text

Is there a way to wrap an image within a Text Box? For example, in standard html I would just align an image to the "right" or "left" and insert padding accordingly. The text would then just wrap around and under. Is there an equivelent action in Captivate 5.0?
I've been just putting text boxes on the page and leaving room and saving space outside of the text box for the image, then put another text box underneath it to make it appear as if it is "wrapping"?
If not - any idea when this functionality will be appearing? Perhaps in 6.0?
kstagg

If you want to see something like this in Cp6 you need to request it as an enhancement.
This is the official Adobe request page: https://www.adobe.com/cfusion/mmform/index.cfm?name=wishform&product=5
With this site you cannot see what others have logged.
And this is the unofficial site that we use and Adobe watches: http://captivate6ideas.ideascale.com/
With this site you can see all the enhancement ideas and vote for the ones you like, as well as add your own if nobody else has already done so.

How to set default for "Horizontal / Vertical Alignment"?

Hi,
is there somewhere a setting to change the default of the "Horizontal / Vertical Alignment" property for an item label? I don't like the "Right" alignment and I have to change it each time when I create a new item.
Thanks
Patrick
http://inside-apex.blogspot.com

Yes, this is one of (many) cases where a Bulk edit feature in the Builder would be very useful. There have been some discussions about this and hopefully the APEX team is considering these for the next release.
Having said that, I frequently find myself taking a full app export and editing the SQL file in my favorite text editor (Vim) and making these little changes.
This is NOT to be done lightly, see the caveats and disclaimers at Re: htmldb application Disabled(on updation of FLOWS_020000.WWV_FLOW_STEP_I
As always, take a backup of the file before modifying it and save it so you can revert back to it if something goes wrong.

Error with list styles using image bullets

I cannot use list styles with image bullets in the mapping of
Framemaker documents. If I define and map a format with image
bullets, then Robohelp creates the correct HTML/CSS code but during
the Webhelp output forgets to copy the used image files to the
required locations. It is possible to manually copy the image files
into the output then the webhelp displays correctly but this is no
possible process for us on a regular basis.

Hi
It's to hard to Mind-Read.
What did the Error Message say ?
You are aware of the 99 photos per SlideShow limit in iDVD ?
I do My SlideShows in
• iMovie HD6 (or FinalCut) or
• FotoMagico
as there are less limit's here
Yours Bengt W

I have a SharePoint list, that list contains photos(images), now i want display that images in spgridview?

Hi All,
i have a SharePoint list, that list contains photos(images).
now i want display that images in spgridview.
How can i display?
Thanks in advance!

Hi,
According to your post, my understanding is that you want to display that images in spgridview.
You can use a hyperlinkfield that is bound to the SPGridView. Please refer to:
Add a Hyperlink Image in a SPGridView
You can also use TemplateField or ImageField to render images. Please refer to:
Image not showing in grid view
In addition, here are two similar articles for your reference:
How To: Use SharePoint 2010 WebParts with a GridView Control to get SQL Image Data
type and other Values
DotNetSharePoint: How to display images in gridview from database using asp.net
Best Regards,
Linda Li
Linda Li
TechNet Community Support

Selecting a Item in horizontal list programatically

Hi,
I have multiple horizontal lists in a canvas and am trying to manage the focus between them.
Am facing problems while I try to programatically select a item by setting the SelectedItem property to [0],
can someone help me please!!
kcb

the following steps solved the problem:
1) Setting the focus to the horizontalList using horizontallist.setfocus() method.
2)Setting the selectedIndex property
3) firing explicitly a key event for the horizontallist.
I did not directly use the horizontal list , I extended the horizontal list class and added a public method which I can call to explicitly call the key event handler.

List of missing images?

RoboHelp HTML 2002.
Is there any way to generate an automated list of missing
images from a project? I'm interested even if a third-party
application is required.
The only way I'm aware of is to open each image folder
individually and scroll down thru the thousand images to look for a
little red X on an image. Inefficient and error-prone for sure.
Is there any better way in this version of RH HTML that I'm
missing?
Thanks.
JoeC

Hey Joe -
I like
Xenu. It
creates a list of all broken and working links, and the price is
right (free).
I also like their stand on Scientology:
http://home.snafu.de/tilman/index.html#cos

Aligning 3 Images

Hi there , I am new to this forum.
I just wondered what the best practice CSS method is to align 3 images on a web page?
I have had a go using float combinations, but none of them work for me.
Any answers out there would be appreciated.

Do you want them evenly spaced on the page?
CSS Floats & Margins Demo: 3 evenly spaced boxes.
http://alt-web.com/DEMOS/3-CSS-boxes.shtml
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
www.alt-web.com/
www.twitter.com/altweb

Center and Vertical Center Align an image

how can I center and vertical align an image so that it stays center and vertically aligned in the middle and on all devices???
Simply put I would like the image smack in the middle of every screen it is viewed on.

Try this
<!DOCTYPE html>
<html>
<head>
<style>
body {
    background-image: url('yourimage.gif');
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center;
</style>
</head>
<body>
</body>
</html>

Horizontal List alignment of images

Similar Messages

Maybe you are looking for