I can't seem to find any sort of documentation about usage of flex-htmlfilter?
Can anyone be kind enough to give me a few sample usage of it? Like, how do I use HTML codes from external pages? E.g. I want to pull the content of the flex-htmlfilter from an external php file.
I'm not sure if you've found an answer by now, but the code below worked for me:
import com.htmlFilter.htmlFilter;
private var theHtmlFilter:htmlFilter = new htmlFilter();
[Bindable]
private var theText:String = theHtmlFilter.filterContent("<p>nothing
important</p><ol><li>item</li><li>item</li><li>item</li></ol>");
Make sure you have the flex-htmlfilter.swc in your libs folder/build path, and then import the custom htmlText component and set the text property to the string "theText." You could pull the compatible html code from your php app and filter it using this technique.
xmlns:custom="com.htmlFilter.*"
<custom:htmlText id="customText"
bottom="0"
verticalScrollPolicy="off"
text="{theText}"
cssFile="styles.css"
width="100%"/>
Related
I hava a problem with flashbuilder:
I have a list with an itemrenderer that renders an image that (should be) draggable.
the rendered image refers to a function that is declared in an actionscript file: dragDrop.as in the folder AS.
the list:
<s:List id="imageList" width="139" height="438"
dataProvider="{xmlListColl}"
itemRenderer="itemRenderer.ImageRenderer"
dragEnabled="true">
</s:List>
the itemrenderer renders this image and refers to the function doDrag:
<mx:Image width="100" height="70" maintainAspectRatio="true"
MouseDownEffect="AS.dragDrop.doDrag(event)"
source="{data.#thumbnailImage}"/>
the function in dragDrop.as:
public function doDrag(event:MouseEvent):void
{
var img:mx.controls.Image = event.currentTarget as mx.controls.Image;
var dragImg:mx.controls.Image = new mx.controls.Image();
dragImg.source = img.source;
var dsource:DragSource = new DragSource();
dsource.addData(img, 'img');
DragManager.doDrag(img, dsource, event, dragImg);
}
but it seems the function is never called...
also parentdocument and outerdocument don't seem to work (if i put the function in the document where the itemrenderer is called)
Please Help!
There's a few issues here, but ultimately, you're not seeing a reference to that method, which means your dragDrop.as file is not including.
Here are a few suggestions:
Replace MouseDownEffect with mouseDown. Instead of causing an effect to occur, you're now listening for the "MouseEvent.MOUSE_DOWN" event to fire. Differences between effects and responding to events are described here and, to quote, "Behaviors let you add animation and motion to your application when some user or programmatic action occurs, where a behavior is a combination of a trigger paired with an effect. A trigger is an action, such as a mouse click on a component ... An effect is a visible or audible change to the target component that occurs over a period of time, measured in milliseconds."
Make sure you're including your dragDrop.as file. Flex 3 vs. Flex 4 handle script tags differently. If you're not including or importing your code, then of course it won't fire.
include vs import is a good question. You can "include" code that's a definition of methods, instances, constants, etc. But you would "import" defined classes for use. Since your method is a public function, does it live within a class? Or is it meant to just live in the script file, in which case you should remove the accessor "public"
If you're looking to implement Drag-and-Drop, I highly recommend NOT re-inventing the wheel and checking out what Adobe has already implemented for components, including dragEnabled='true' and dragMoveEnabled='true'. Check them out here: http://livedocs.adobe.com/flex/3/html/help.html?content=dragdrop_4.html
http://livedocs.adobe.com/flex/3/html/help.html?content=dragdrop_1.html
Here is an example of a Flex 3 script tag:
<mx:Script source="AS/dragDrop.as"/>
Here is an example of a Flex 4 script tag:
<fx:Script source="AS/dragDrop.as"/>
This is an link to the documentation on how to include directly into a <fx:Script> tag the code you'd like: http://help.adobe.com/en_US/flex/using/WS2db454920e96a9e51e63e3d11c0bf61c8a-7ff4.html
I need to change browser title via flex.
How can I change the broser title with flex in execution time?
I'm setting the title like this:
<mx:Application (xxx) pageTitle="ConfigApp.getTitle()}" (xxx) >
You can use the BrowserManager class for this. It has a function called setTitle() which does exactly what you want.
The BrowserManager can also handle a lot more interactions between Flex and the browser. I wrote a more elaborate answer on this topic earlier, which you can find here: Bookmarks in Flex
This works for me:
import mx.managers.BrowserManager;
import mx.managers.IBrowserManager;
import mx.events.BrowserChangeEvent;
private var bm:IBrowserManager;
bm = BrowserManager.getInstance();
bm.setTitle("... Page title xxx ...");
I have used Flash to make skins, which I import and apply to Flex components.
But how can I create a component in Flash, with properties and methods. And make it able to be added to the displayList in a Flex app?
I installed the Flex component kit for flash. Created my component in flash (it extends MovieClip). Did Command->Convert to flex Component, did File->Published, which gave me a .swc, dropped the .sec file into my Flex project. Now when I create a new var the class "FlashFlexComponentTest" pops up in the new class hint box, so flex sees it. But afterwards I get the error:
Type was not found or was not a
compile-time constant: FlashFlexComponentTest
I feel like I must be missing a step?
Thanks!
UPDATE
I added the .swc via project build path -> add SWC.
I no longer have a compile-time error but I am getting a runtime error:
Type Coercion failed: cannot convert FlashFlexClassTest#9089129 to mx.core.IUIComponent
The base class for all flex components, UIComponent, allows you to add Sprites that don't implement the IUIComponent interface.
An example :
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical"
creationComplete="init();">
<mx:Script>
<![CDATA[
private function init():void
{
var component:FlashFlexClassTest = new FlashFlexClassTest();
container.addChild(component);
}
]]>
</mx:Script>
<mx:UIComponent id="container" width="100%" height="100%"/>
</mx:Application>
There's a good video tutorial on this at Linda.com by David something. I did a lot of this a year or so ago, and that was the best resource I found. Doesn't cover absolutely every possible angle, but does a great job of covering what you need to know.
I'm guessing there's just some small linkage detail that you're missing. The tutorial should get you straight, if that's the case. It was worth the $20, or whatever, for a monthly subscription for me.
Sorry, that's the best I can do... haven't built Flex components in Flash since last year.
basically there are step what need to do:
open Flash
drag a component you need to stage
right click on it in Library > Export to SWC
put this SWC in your Flash Builder libs folder
There is explanation by Jesse Warden http://jessewarden.com/2011/06/integrating-flash-components-with-flex-revisited.html
Cheers!
I am in the process of creating a new - "lite" - version of a Flex application I created a while ago. I have been porting over many of the Classes and Components to a Flex Library Project that compiles an SWC file. Because both are Cairngorm applications, I'm not able to completely eradicate duplicate code, but it seems logical that I should be able to share assets - such as icons (PNG files). What is the best way to do this? I have tried including them in the SWC, but I can't figure out how to access them in the application. If you can help me figure that out, then my question will be answered. Any thoughts?
Here is and example of how I currently embed icons/images in my Flex application:
<mx:Script>
<![CDATA[
[Bindable]
[Embed(source="assets/icons/cancelIcon.png")]
private var cancelIcon:Class;
[Bindable]
[Embed(source="assets/icons/saveIcon.png")]
private var saveIcon:Class;
]]>
</mx:Script>
Thanks.
0) First, looking at the code above - I recommend some minor changes:
// Actionscript instead of MXML:
public class ResourceClasses
{
Bindable]
[Embed(source="assets/icons/cancelIcon.png")]
public static var CancelIconClass:Class;
// make your variable public and static without public no one
// outside the class can access AND bindable won't matter
}
---- Now, compile your library.
---- If the assets aren't in the right place the compiler will complain
1) In your application, you need to reference the library project / swc
---- You should be able to get code hints / intellisense in Flex Builder / eclipse from classes in your Application to classes in the library project
2) In your Application - Do some code like this:
var image:Image = new Image();
image.source = ResourceClasses.CancelIconClass;
// more image property setting...
someCanvas.addChild(image);
3) This will get you going - using a Library project to hold images, etc...
*** DO NOTE: If the images need to be loaded multiple times, reused, etc -- There are other steps to take to squeeze out the best performance, etc...
This section of the livedocs would be interesting to you:
http://livedocs.adobe.com/flex/3/html/help.html?content=building_overview_5.html.
Do you have a specific example of how you are embedding the assets and trying to use them in the resulting swc that isn't working? Do you think your problem is in the embedding them into the swc or using them from the swc in the actual application?
Well, using #Gabriel's advice, here's what I ended up with:
package
{
[Bindable]
public class ResourceClasses
{
[Embed(source="assets/icons/cross.png")]
public static var CancelIconClass:Class;
}
}
Referenced in my application like this:
<?xml version="1.0" encoding="utf-8"?>
<mx:Box xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Button label="Cancel Changes" icon="{ResourceClasses.CancelIconClass}" />
</mx:Box>
Thanks!
Ok, so I have a custom render that I have created:
<mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml"
horizontalAlign="center"
verticalAlign="middle"
width="100"
height="100">
<mx:Script>
<![CDATA[
[Bindable]
private var fileLabel:String;
[Bindable]
private var fileIcon:Class;
override public function set data(value:Object):void{
fileLabel = value.label;
fileIcon = value.file.url;
}
]]>
</mx:Script>
<mx:Image source="{fileIcon}" />
<mx:Label text="{fileLabel}" />
</mx:VBox>
That I want to use for a photo gallery with images that are dragged and dropped onto a TileList. I have that part down, but I can't seem to get the icon thing to work.
Given: value is sort of wrapper for a File class. I want to set the mx:Image source to something that needs to be of type Class. Using nativePath or url gives me a cast error. I see tons of examples online using XML and something like "Embed(/url/to/img.jpg)". I promise you that if you give me one of those examples (using a static image) I will give you a negative vote. THAT IS NOT WHAT IM LOOKING FOR HERE!
The reason that this isn't working is because the type of the fileIcon property is Class. You would generally would only want an object of type Class if you plan to use it like a factory, creating instances of that class with it. When you use the [Embed] metadata, you are indicating to the compiler that it should embed the specified asset into the SWF and also generate a Class to act as a factory for vending object instances that can represent that asset. However, as you had already discovered before posting this question, the problem with [Embed] is that you need to hard-code the reference, it doesn't let you supply a value at runtime (because the compiler needs to literally embed the asset, at compile-time).
Fortunately, mx:Image.source is a very flexible property that also accepts Strings (despite the fact that most documentation demonstrates using it with embedded assets). As long as the Flex application is capable of loading the asset, you can just supply a String-typed URL as the source.
Change the type of fileIcon to a String, and also verify that value.file.url is actually a URL of an image that your application can load. (You can test this just by hardcoding this URL into the mx:Image's source attribute.)