2 Replies Latest reply on Sep 3, 2009 7:21 AM by leybniz

    An image base64de/en-code and xml

    Revlex Level 1

      Hi all,

       

      Im trying to save a image in xml not it's path or other stuff, just the hole immage, im doing this with this method: I use a bytearray(image) base64Encoder.toString(); then i save the output of it in to a XML file.

       

      then i load the xml file at runtime, and start decoding it.

       

      my question is: How can i get the decoded string into a bytearray and then convert it back to an immage?

       

      with big regard,

       

      Revlex

        • 1. Re: An image base64de/en-code and xml
          leybniz Level 4

          you can use Bitmap class for that, simple googling around that class will pops out tons of examples for you.

          • 2. Re: An image base64de/en-code and xml
            Revlex Level 1

            Whel now im keep getting this error: loader.loadBytes must be greater than 0

             

            this is my code:

             

            <?xml version="1.0" encoding="utf-8"?>
            <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/halo" minWidth="1024" minHeight="768">
            <fx:Script>
                <![CDATA[
                    import mx.utils.Base64Decoder;
                    import mx.utils.Base64Encoder;
                    import mx.utils.StringUtil;
                    import mx.collections.XMLListCollection;
                    import flashx.textLayout.tlf_internal;
                    import mx.rpc.events.XMLLoadEvent;
                    import mx.utils.XMLUtil;
                    import flashx.textLayout.conversion.TextFilter;
                    import mx.controls.Alert;
                    import mx.utils.ObjectUtil;
                   
                    private var new_xml:XML = new XML();
                    private var the_image:FileReference = new FileReference();
                    private var the_image_2:FileReference = new FileReference();
                    private var the_image_3:FileReference = new FileReference();
                    private var the_image_4:FileReference = new FileReference();
                   
                    private var xml_savo:FileReference = new FileReference();
                    private var xml_load:FileReference = new FileReference();
                   
                   
                    private var filter:TextFilter = new TextFilter();
                   
                    private function load_xml(e:MouseEvent):void
                    {
                        var xml_array:Array = [];
                        xml_array.push(new FileFilter("xml", "*.xml;"));
                        xml_load.browse(xml_array);
                        xml_load.addEventListener(Event.SELECT, xml_loader);
                       
                    }
                   
                    private function xml_loader(e:Event):void
                    {
                        xml_load.load();
                        xml_load.addEventListener(Event.COMPLETE, xml_open);
                    }
                    private function xml_open(e:Event):void
                    {
                        var le_text:String = xml_load.data.toString();
                        var old_xml:XML = new XML(le_text);
                        var bas64de:Base64Decoder = new Base64Decoder
                       
                        bas64de.decode(old_xml.elements("foto_1"));
                        bas64de.toByteArray();
                        tekst_stuk.text = old_xml.elements("tekst_stuk").toString();
                        titel.text = old_xml.elements("titel").toString();
                       
                        var loader:Loader = new Loader();
                        var byte:ByteArray = new ByteArray();
                       
                        byte = bas64de.toByteArray();

                        loader.loadBytes(byte);
                        loader.contentLoaderInfo.addEventListener(Event.COMPLETE,loaderCompleteHandler);
                    }
                   
                    private function loaderCompleteHandler(event:Event):void
                    {
                        var loader:Loader = event.target as Loader;
                        var bmp:Bitmap = Bitmap(loader.content);
                       
                        img.source = bmp;
                    }
                   
                    private function xml_save(e:MouseEvent):void
                    {
                        var bas64:Base64Encoder = new Base64Encoder();
                        bas64.encode(the_image.data.toString());
                       
                        new_xml = <info>
                                <titel>
                                    {titel.text}
                                </titel>
                                <tekst_stuk>
                                {tekst_stuk.text}
                                </tekst_stuk>
                                <foto_1>
                                {bas64}
                                </foto_1>
                                <foto_2>
                                {the_image_2.name}
                                </foto_2>
                                <foto_3>
                                {the_image_3.name}
                                </foto_3>
                                <foto_4>
                                {the_image_4.name}
                                </foto_4>
                            </info>;
                           
                            new_xml.toXMLString();
                            xml_savo.save(new_xml,titel.text+".xml");
                           
                    }
                   
                    private function plaatje(e:MouseEvent):void
                    {
                        var arr:Array = [];
                        arr.push(new FileFilter("Images", ".jpeg;*.jpg;*.png"));
                        the_image.browse(arr);
                        the_image.addEventListener(Event.SELECT, selected);
                    }

                    private function selected(E:Event):void
                    {
                        the_image.load();
                        the_image.addEventListener(Event.COMPLETE, image_done);
                    }

                    private function image_done(E:Event):void
                    {
                        img.source = the_image.data;
                        this.removeElement(btn_1);
                    }
                   
                    //begin
                    private function plaatje_2(e:MouseEvent):void
                    {
                        var arr:Array = [];
                        arr.push(new FileFilter("Images", ".jpeg;*.jpg;*.png"));
                        the_image_2.browse(arr);
                        the_image_2.addEventListener(Event.SELECT, selected_2);
                    }

                    private function selected_2(E:Event):void
                    {
                        the_image_2.load();
                        the_image_2.addEventListener(Event.COMPLETE, image_done_2);
                    }

                    private function image_done_2(E:Event):void
                    {
                        img_2.source = the_image_2.data;
                        this.removeElement(btn_2);
                    }
                    //einde
                            //begin
                            private function plaatje_3(e:MouseEvent):void
                    {
                        var arr:Array = [];
                        arr.push(new FileFilter("Images", ".jpeg;*.jpg;*.png"));
                        the_image_3.browse(arr);
                        the_image_3.addEventListener(Event.SELECT, selected_3);
                    }

                    private function selected_3(E:Event):void
                    {
                        the_image_3.load();
                        the_image_3.addEventListener(Event.COMPLETE, image_done_3);
                    }

                    private function image_done_3(E:Event):void
                    {
                        img_3.source = the_image_3.data;
                        this.removeElement(btn_3);
                    }
                    //einde
                            //begin
                    private function plaatje_4(e:MouseEvent):void
                    {
                        var arr:Array = [];
                        arr.push(new FileFilter("Images", ".jpeg;*.jpg;*.png"));
                        the_image_4.browse(arr);
                        the_image_4.addEventListener(Event.SELECT, selected_4);
                    }

                    private function selected_4(E:Event):void
                    {
                        the_image_4.load();
                        the_image_4.addEventListener(Event.COMPLETE, image_done_4);
                    }

                    private function image_done_4(E:Event):void
                    {
                        img_4.source = the_image_4.data;
                        this.removeElement(btn_4);
                    }

                ]]>
            </fx:Script>


            <mx:ControlBar>
                <s:Button label="Load" id="load" enabled="true" click="load_xml(event);"/>
                <s:Button label="Save" enabled="true" id="save_xml" click="xml_save(event);"/>
            </mx:ControlBar>
                <mx:Image x="22" y="113" id="img" width="300" height="200"/>
                <s:TextInput x="25" y="60" id="titel" text="Titel" enabled="true"/>
                <s:TextArea x="25" y="360" editable="true" enabled="true" id="tekst_stuk" width="550"/>
                <s:Button label="Picture 1" id="btn_1" enabled="true" click="plaatje(event);" x="135" y="205"/>
                <mx:Image x="440" y="110" width="100" height="50" id="img_2"/>
                <mx:Image x="440" y="180" width="100" height="50" id="img_3"/>
                <mx:Image x="440" y="250" width="100" height="50" id="img_4"/>
                <s:Button x="455" y="127" label="Picture 2" id="btn_2" enabled="true" click="plaatje_2(event);"/>
                <s:Button x="455" y="198" label="Picture 3" id="btn_3" enabled="true" click="plaatje_3(event);"/>
                <s:Button x="455" y="266" label="Picture 4" id="btn_4" enabled="true" click="plaatje_4(event);"/>   
            </s:Application>