I didn't see any scrollbars on the image.

 

________________________________

From: [email protected]
[mailto:[EMAIL PROTECTED] On Behalf Of rockwellej
Sent: Sunday, July 27, 2008 9:44 AM
To: [email protected]
Subject: [flexcomponents] ScrollBar and Canvas Urgent Please Help ..

 

All .. I sent a post earlier on this .. but I'm attaching some code now
..

essentially I want to display a scrollable canvas with an array of pics
the also scroll in 
columns .. I have a custom loader the loads the pics from directory on
the web server so 
the client can swap out pics at will ... the problem is how the client
wants the scroll bar(s) 
..

go here to see a flat of the proposed product ..

http://www.edwardrockwell.com/keithkitz/pics/kkflat.png
<http://www.edwardrockwell.com/keithkitz/pics/kkflat.png> 

here's the mxml .. I've been trying a whole bunch of different stuff ..
I thought it would be as easy as skinning the scroll bar for the outer
canvas and moving the position of the scroll bar ..

the properties that are set now on the components are obviously wrong ..
it's just the last state of the xml that I've gotten to .. I don't think
that the
"content" canvas is expanding to the total height and width of the pics,
but when I 
re-size the browser window more pics are revealed .. so I guess I'm
wrong 
about that .. at this point I'm not sure how these components work
internally.. that
are loaded into it .. I set the clipContent to true just for the hell of
it to see
how it would affect things .. .. the content canvas just contains VBoxes
filled
with Images .. the images are 480x680 and there are 8 VBoxes total with
around
4 to 6 images in each in the content canvas .. o

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml
<http://www.adobe.com/2006/mxml> " 
layout="absolute" width="100%" height="100%" backgroundColor="black" 
applicationComplete="initApp();" 
xmlns:kk="*">

<mx:Style source="kk.css"></mx:Style>

<mx:Script>
<![CDATA[
import mx.events.ScrollEvent; 

[Embed(source="kk.svg")] 
[Bindable] 
public var kkCls:Class;
public var m:Main;

public function initApp():void {
//content.horizontalScrollBar = kkScrollBar;
m = new Main();


}



// Event handler function to display the scroll location.
private function moveContent(event:ScrollEvent):void {
trace("moveContet");
content.x += event.currentTarget.scrollPosition;
//content.move(event.currentTarget.scrollPosition, content.y);
this.validateNow();
// "Current scroll position: " + 
// event.currentTarget.scrollPosition + '\n' +
// "The maximum scroll position: " + 
// event.currentTarget.maxScrollPosition + '\n' +
// "The minimum scroll position: " + 
// event.currentTarget.minScrollPosition;

} 
]]>
</mx:Script>

<mx:Canvas height="100%" width="100%" horizontalScrollPolicy="off" 
verticalScrollPolicy="off">
<mx:Canvas horizontalScrollPolicy="on" autoLayout="false" top="0"
left="0" 
id="content" visible="true" clipContent="true">
</mx:Canvas>

<mx:HScrollBar left="0" visible="true" width="100%" id="kkScrollBar" 
enabled="true" minScrollPosition="0" maxScrollPosition="{content.width}"
lineScrollSize="685" pageScrollSize="685" bottom="{height - 485}" 
scroll="moveContent(event);">
</mx:HScrollBar>

<mx:HBox id="brandingBar" width="100%" height="{height - 485}" 
alpha="0.95" 
bottom="0" right="0"
verticalScrollPolicy="off" horizontalScrollPolicy="off">
<mx:Image id="kkImage" source="{kkCls}" scaleContent="true"
autoLoad="true" 
x="10"/>
</mx:HBox> 
</mx:Canvas>
</mx:Application>

 

Reply via email to