Display image in datagrid column
I have a datagrid with a column that displays true or false
if an item "has children" or not. How would I go about placing an
image in the column depending on the value of the column. I want to
have two different images one for false and one for true.
make your item renderer a canvas, with 2 images.
when your canvas loads, you have the 'data' of that cell. So
lets say your column's datafield is "hasimage", you can do
something like this:
<mx:Canvas xmlns:mx="
http://www.adobe.com/2006/mxml"
creationComplete="created();">
override public function set data(value:Object):void
if(value != null)
super.data = value;
public function created():void
if(data["hasimage"] == "true")
trueImg.visible = true;
else
falseImg.visible = true;
<mx:Image id="trueImg" src="image" visible="false" />
<mx:Image id="falseImg" src="image" visible="false" />
</mx:Canvas>
Similar Messages
-
Need help adding image to datagrid column
Hi,
Can anyone tell me how to add an image to a datagrid column?
I have created a flex library project which contains a mxml component with a datagrid, an item renderer mxml component which rendered the image within the datagrid column depending on the value coming back from the database for that column and a folder 'assets' which hold all the images. When I add the library to my main project and call the mxml component with the datagrid an image place holder is visible in the datagrid column but not the image. However, if I take the image out of the library project and added to an 'assets' folder in the main project the image is displayed in the datagrid column.
It looks like, even though the images are in the flex library project and only the flex library project is trying to display the images in the datagrid, the library project is looking in the main application project folder for the image.
Does anyone know why this is happening and how to fix it?
Thanks in advance for an help,
Xander.I have tried embedding the images in my library but it still didn't work. Also I can't embed the image as I'm using the value of the column to complete the image name, for example in my mxml item renderer component I have the added the following code
<mx:Image source="@Embed(source='assets/' + data.mycolumnvalue + '.png')" tooltip="{data.mycolumnvalue}"/>
but nothing is displayed. -
How to display images from BLOB column via APEX 4.0
Hello,
I did the following in order to display images of two Oracle records on the APEX page. I am using APEX Version : 4.0.1.00.03 , Oracle DB Version : 10.2.0.4.0.
1. Created An oracle table TEST_FORM
with 3 columns
( ID number, MIME_TYPE varchar2(255) , Image BLOB )
2. Inserted two records
10001, image/gif, ( actual image1)
10002, image/gif, ( actual image2)
3. created an Oracle procedure
CREATE OR REPLACE PROCEDURE show_my_form ( p_image_id IN test_form.id%type) AS
l_mime test_form.mime_type%type;
l_length NUMBER;
l_file_name VARCHAR2 (2000);
lob_loc test_form.IMAGE%type;
BEGIN
SELECT mime_type, IMAGE
, DBMS_LOB.getlength (IMAGE)
INTO l_mime, lob_loc, l_length
FROM test_form
WHERE id = p_image_id;
owa_util.mime_header(l_mime, false);
htp.p ('Content-length: ' || l_length);
owa_util.http_header_close;
wpg_docload.download_file (lob_loc);
END show_my_form ;
4. In Apex 4.0
step1. Created an interactive report on a new APEX page
step2. Specified the following in the Region Source
select id, mime_type, '<img src="#OWNER#.show_my_form ?p_image_id=#ID#" />' photo
from TEST_FORM
The column result shows as <img src="CCS.show_my_form?p_image_id=#ID#" />
I am unable to display the column image as a link to a proper image photo.
Could you please advise me if I missed anything ?
Thanks a lot.
Regards
Susanna
Edited by: user10318332 on 13/12/2010 15:51
Edited by: user10318332 on 13/12/2010 20:10Maybe the space you have before the ? is causing issues. there shouldn't be any space.
Your procedure looks to be much the same of one that I have.
Have you granted execute on your procedure?
Also, what version DB are you running? This could be another issue: http://daust.blogspot.com/2006/04/xe-calling-stored-procedures.html
But anyway, you don't need to create your own procedure these days. You could do the following:
in your query, have a column: dbms_lob.getlength(blob) photo ; save, then in column attributes for that column, apply a format mask. There is usually a link below the text box for the format mask - BLOB Download Format Mask, which will help you build the format mask. But it is documented here: http://download.oracle.com/docs/cd/E17556_01/doc/user.40/e15517/advnc.htm#BCGGJHEF
Ta,
Trent -
Hi,
I have to display only images on a web page in JSF2.0 in Netbeans. I am using datatable and column to do so. But there is one problem.
All images are display only in single column(i.e. vertically). I want to display in rows and columns not only column.
e.g. One row will have atleast 3 images and more rows like this.
Which attribute should i use of datatable? or should i use some other tag?
My code is:
<h:dataTable var="images"
value="#{jsfMBean.allImages}"
rules="none"
cellpadding="20"
border="0" >
<h:column>
<h:graphicImage value="faces/WEB-INF/upload/#{images.picid}" width="300px" height="100px" />
</h:column>
</h:dataTable>
Thanks.
NetBeans 6.9.1
JSF 2.0 with facelets
glassfish 3.0
Enterprise java beans
PrimeFaces 3.0I believe you are looking for the panelgrid, not the datatable.
Note that there are a few useful websites online that list the available JSF tags plus their properties, such as these:
http://www.horstmann.com/corejsf/jsf-tags.html
http://www.exadel.com/web/portal/jsftags-guide -
Apex 4.0 display image item :BLOB column returned by SQL statement
Hello
I'm creating an display image item in apex 4.0. The source is a BLOB column returned by SQL statement.
When I'm issuing an sql statement like this:
select lado.blob_content
from large_documents lado
, large_doc_headers ladh
where lado.ladh_nr = ladh.nr
more criteriait works fine.
When I create a function inside a package with the same query (in a cursor)
function get_image(some parameters in) return blob
Following in apex by:
select get_image(some parameters) from dualI get a
ORA-06502: PL/SQL: numeric or value error: character string buffer too smallAnybody any idea why this does not work?
Regards ErikHi Eric,
the environment assumes varchar2-output by default, which will be limited to 32767 characters and may have problems with binary formats. You could define a blob-variable to select the value into.
DECLARE
l_blob BLOB;
BEGIN
SELECT get_image(some parameters)
INTO l_blob
FROM dual;
END;
/If you expect the BLOB-Content to be text (you should consider CLOB then), you may use UTL_RAW.CAST_TO_VARCHAR2 to convert the content. If your object is larger than the maximum varchar2 size, or you want to convert BLOB to CLOB, you might be interested in some converter like described here: {message:id=559749}
Hope this is what you were searching for.
-Udo -
Hi,
I need to display an image over the Datagrid exactly centered horizontally and vertically. The Datagrid can be of different height and width at different instances. Is there a way to achieve this?
I used backgroundImage style property, however the image goes behind the datagrid content. I wish, there was a foregroundImage property which could have served my purpose.
Please suggest.
Thanks,
UmaI would use a group and keep them seperate
remember the z index is dependent in the order you create them in mxml -
Problem Displaying image from blob
Hi all,
I m using,
Database : 10g Rel 2
Frontend : DevSuite 10g
OS : WinXp
Browser : IE 6
Problem : In my forms i m displaying images from blob column but some of the images are not displayed. I have tried with all image formats available in combination with all available display quality but no luck. What could be the reason for it and how do i solve it?
Can anyone help me plz?
Thnx in advance.
ImtiazHello,
It is very difficult for us to "guess" what images you can read and what others you cannot.
Maybe you could provide more information on images that are not displayed ?
What is their native format ?
Francois -
Displaying images in many rows
Hello everyone. I have images in my database that I want to
display on my home page. The issue I'm having is that I want to
display 7 images per row and have 2 rows. After the first 7 images
are displayed, I want to start a new row automatically with an
additional 7 images and don't know how to do that. Can someone
please help?I still cannot get the code to work. Right now it's
displaying images as one column down the left side of the page.
<cfset counter = 0>
<!--- Grab the most recent profiles --->
<cfquery name="latest_joiners" datasource="db"
maxrows="14">
SELECT * FROM db ORDER BY id DESC
</cfquery>
<table border="0" cellspacing="0" cellpadding="2"
width="100%">
<tr>
<cfloop query="latest_joiners">
<td>
<img src="images/pictures/#pic_path#" height="70"
width="98" border="1">
</td>
<cfif (counter MOD 7) IS 0>
</tr>
</cfif>
</table>
</cfloop> -
How do I show an image in a DataGrid column?
I'm not sure that this is possible. I would like to show an
image in a datagrid column based on the data that the grid is bound
to. Is there any way to do this? I'm using Beta 3.
Thanks!Yes, you need a custom itemRenderer. This can be inline or a
custom class.
Tracy -
How to display images in a table column?
Hi,
In a VC model, I have to display images in a table column for each record found.
How can this be done?
Regards,
NitinHi Nitin,
It can be done by adding to the table the Image control (can be found under Advanced Controls in the Compose panel).
In the URL property (in the Configure panel of the Image control) you can define any expression that will return the image URL. For example:
="http://hosting.site.url/"&@ImageNameField
Regards,
Udi
Edited by: Udi Cohen on Jun 11, 2008 1:39 PM -
Displaying images from ORDSYS.ORDIMAGE columns
Does anyone know, if Oracle9i Reports can display images fetched from ORDIMAGE columns in the database? If so, could you give me a brief explanation how?
Thanks in advance!Jacob,
As of now , it is not supported. It is under development for next release.
It currently supports images stored in DB as LOBs
Thanks
The Oracle Reports team -
Displaying Image from ADF BC (BLOB Column) in ADF Mobile Application
I have made an ADF BC over a database. Now I want to use that ADF BC's data control in my ADF Mobile App to display image stored in a blob column in the database!
How should I got about it?
Regards,
Muhammad ZaheerSir,
I have exposed it through web services and I'm using the Web Service data control in my mobile application but the blob column is shown as output text in the data control. Now I don't know how to display the image from the blob column in my ADF mobile application.
Looking forward for your help.
Thank you. -
Hierarchy column display image(Triangle) format need to be changed in obiee11g
Hi ALL,
Hierarchy column display image(Triangle) format need to changed
For Mobile users of obiee11g, the triangle symbol image is big in size while viewing in mobile phone,i have two issues
1. I need to reduce the size of triangle image
2.Need to reduce the spacing between triangle image and the text
Expecting the the response ASAP
Thanks,
BalaHi ALL,
Hierarchy column display image(Triangle) format need to changed
For Mobile users of obiee11g, the triangle symbol image is big in size while viewing in mobile phone,i have two issues
1. I need to reduce the size of triangle image
2.Need to reduce the spacing between triangle image and the text
Expecting the the response ASAP
Thanks,
Bala -
Displaying image from Database with php
Hello everybody,
I'm working on a website that displays videos courses and tutorials as my final project
and I'm working with "Flash builder 4" the database with mySQL and the application server with php
Basically, the goal is to display a datagrid that shows the manager of the website in column all the information stored on the "Course" table
the structure of the table is :
Course (id,img,src,title,description)
-id : primary key
-img : path to a photo of course {for example picture of JAVA}
-src : path to the playlist file {xml file}
-title : String
-description : String too
I already succeeded to display all these contents on a DataGrid, but not with the image, I couldn't display an imageon its column using the path stored on the database, I used a DataRenderer to do that, and here is my code for Renderer and the DataGrid.mxml
CourseGrid.mxml
<?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/mx" minWidth="955" minHeight="600" xmlns:courseservice="services.courseservice.*">
<fx:Script>
<![CDATA[
import Renderers.CourseDeleteRenderer;
import Renderers.CourseImageRenderer;
import mx.controls.Alert;
import mx.events.FlexEvent;
protected function dataGrid_creationCompleteHandler(event:FlexEvent):void
getAllCourseResult.token = courseService.getAllCourse();
]]>
</fx:Script>
<fx:Declarations>
<s:CallResponder id="getAllCourseResult"/>
<courseservice:CourseService id="courseService" fault="Alert.show(event.fault.faultString + '\n' + event.fault.faultDetail)" showBusyCursor="true"/>
<!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>
<mx:DataGrid x="10" y="10" id="dataGrid"
creationComplete="dataGrid_creationCompleteHandler(event)"
dataProvider="{getAllCourseResult.lastResult}"
width="100%">
<mx:columns>
<mx:DataGridColumn headerText="" dataField="img" sortable="false" itemRenderer="Renderers.CourseImageRenderer"/>
<mx:DataGridColumn headerText="id" dataField="id"/>
<mx:DataGridColumn headerText="src" dataField="src"/>
<mx:DataGridColumn headerText="title" dataField="title"/>
<mx:DataGridColumn headerText="description" dataField="description"/>
<mx:DataGridColumn headerText="Delete" itemRenderer="Renderers.CourseDeleteRenderer"/>
<mx:DataGridColumn headerText="Update" itemRenderer="Renderers.CourseUpdateRenderer"/>
</mx:columns>
</mx:DataGrid>
</s:Application>
CourseImageRenderer.mxml
<?xml version="1.0" encoding="utf-8"?>
<s:MXDataGridItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
focusEnabled="true">
<mx:Image source="{data}" width="60" height="60"/>
</s:MXDataGridItemRenderer>
Result :
Problem :
How can I access to the path of the image, I tried to write "data.img" instead of "data" as img is the name of the column in the database that stores the path but it wasn't successful.
I know that it not complete statement "data" because "data" is a reference to what the DataGrid provides of information that gets from the (CreationComplete) event.
Question :
- Can you please help me with this so I can complete displaying images by accessing to what is on the column in tha DB so I can manipulate my datas that is stored there ?
==> I still have some questions about the buttons to update and delete datas fomr the DataGrid, but, until now I need to access successfully to the photo and display it
Thank you,Anyone that can help me with this ?
Please, try this with me, I'm asking Flex developpers this might be easy for you !
It's just question of how to access the string stored in the variable "data", when I used XML I just type the path to the repeated element like this :
XML file :
XML File
<parent>
<child>
<repeated_child></repeated_child>
<repeated_child></repeated_child>
<repeated_child></repeated_child>
</child>
</parent>
I used a Model as a reference to the xml file
and an arrayList as a container of the repeated child
I just write in the code "data.parent.repeated_child" to access the text in the "repeated_child"
and here is the code, that I implemented to generate videos from xml file to display a video play list
Video Playlist code(extract from XML file "data.xml")
<fx:Declarations>
<fx:Model id="model" source="assets/data.xml"/>
<s:ArrayList id="products" source="{model.video}"/>
</fx:Declarations>
<mx:List dataProvider="{products}" labelField="title"
change="list1_changeHandler(event,List(event.currentTarget).selectedItem)" x="103" y="77" height="350" width="198"/>
That was my goal to do that with the database.
Please help me
If you have other solution I still need it.
Thank you, -
How can I get this example to wok with <mx:HTTPService>
insead of the inline <mx:XML> ?
Dynamic DataGrid columns
Example of how to dynamically create DataGridColumns
A completely dynamic DataGrid example.
This example uses the xml from the Flexstore example. It
examines the first product node and uses that to create the
definitions for the columns. There is some example logic to change
the columns properties.
It then instantiates the GataGrid and its columns array,
assigns the properties, and then the dataProvider, and then adds
the dataGrid to the application container.
The example is fully self-contained, since a portion of the
catalog.xml file is included in the mxml.
<?xml version="1.0" encoding="utf-8"?>
<!-- This example uses the dataProvider to build the
dataGrid columns dynamically -->
<mx:Application xmlns:mx="
http://www.adobe.com/2006/mxml"
layout="vertical"
creationComplete="initApp()">
<mx:Script><![CDATA[
import mx.controls.dataGridClasses.DataGridColumn;
import mx.controls.DataGrid;
import mx.collections.XMLListCollection;
import mx.controls.Alert;
[Bindable]
private var _xlcCatalog:XMLListCollection; //the
dataProvider for the DG
//run by creationComplete
public function initApp():void
_xlcCatalog = new XMLListCollection(xmlCatalog.product);
//wrap the XML product nodes in an XMLListCollection
buildDG(); //creates the dataGrid
}//initApp
private function buildDG():void
var aColumnDef:Array = getColumnDefArray(); //returns a
noraml array of objects that specify DtaGridColumn properties
var oColumnDef:Object;
var dg:DataGrid = new DataGrid; //instantiate a new DataGrid
var dgc:DataGridColumn;
var aColumnsNew:Array = dg.columns
var iTotalDGWidth:int = 0;
for (var i:int=0;i<aColumnDef.length;i++) { //loop over
the column definition array
oColumnDef = aColumnDef
dgc = new DataGridColumn(); //instantiate a new
DataGridColumn
dgc.dataField = oColumnDef.dataField; //start setting the
properties from the column def array
dgc.width = oColumnDef.width;
iTotalDGWidth += dgc.width; //add up the column widths
dgc.editable = oColumnDef.editable;
dgc.sortable = oColumnDef.sortable
dgc.visible = oColumnDef.visible;
dgc.wordWrap = oColumnDef.wordWrap;
aColumnsNew.push(dgc) //push the new dataGridColumn onto the
array
dg.columns = aColumnsNew; //assign the array back to the
dtaGrid
dg.editable = true;
dg.width = iTotalDGWidth;
dg.dataProvider = _xlcCatalog; //set the dataProvider
this.addChild(dg); //add the dataGrid to the application
}//buildDG
//uses the first product node to define the columns
private function getColumnDefArray():Array
//Alert.show("colcount:" + xmlCatalog.toXMLString());
var aColumns:Array = new Array();
var node0:XML = xmlCatalog.product[0]; //get the first
"product" node
var xlColumns:XMLList = node0.children(); //get its child
nodes (columns) as an XMLList
var xmlColumn:XML
var oColumnDef:Object;
for (var i:int=0;i<xlColumns.length();i++) { //loop over
the xmlList
xmlColumn = xlColumns;
oColumnDef = new Object();
oColumnDef.dataField = xmlColumn.localName(); //make the
dataField be the node name
switch (oColumnDef.dataField) { //conditional column
property logic
case "name":
oColumnDef.width = 80;
oColumnDef.sortable = false;
oColumnDef.visible = true;
oColumnDef.editable = false;
oColumnDef.wordWrap = false;
break;
case "description":
oColumnDef.width = 200;
oColumnDef.sortable = false;
oColumnDef.visible = true;
oColumnDef.editable = false;
oColumnDef.wordWrap = true;
break;
case "price":
oColumnDef.width = 40;
oColumnDef.sortable = true;
oColumnDef.visible = true;
oColumnDef.editable = true;
oColumnDef.wordWrap = false;
break;
case "image":
oColumnDef.width = 100;
oColumnDef.sortable = false;
oColumnDef.visible = false;
oColumnDef.editable = false;
oColumnDef.wordWrap = false;
break;
default:
oColumnDef.width = 50;
oColumnDef.sortable = true;
oColumnDef.visible = true;
oColumnDef.editable = false;
oColumnDef.wordWrap = false;
break;
aColumns.push(oColumnDef);
return aColumns; //return the array
}//getColumnDefArray
]]></mx:Script>
<mx:XML id="xmlCatalog">
<catalog>
<product productId="1">
<name>Nokia 6010</name>
<description>Easy to use without sacrificing style,
the Nokia 6010 phone offers functional voice communication
supported by text messaging, multimedia messaging, mobile internet,
games and more</description>
<price>99.99</price>
<image>assets/pic/Nokia_6010.gif</image>
<series>6000</series>
<triband>false</triband>
<camera>false</camera>
<video>false</video>
<highlight1>MMS</highlight1>
<highlight2>Large color display</highlight2>
</product>
<product productId="2">
<name>Nokia 3100 Blue</name>
<description>Light up the night with a
glow-in-the-dark cover - when it's charged with light you can
easily find your phone in the dark. When you get a call, the Nokia
3100 phone flashes in tune with your ringing tone. And when you
snap on a Nokia Xpress-on™ gaming cover*, you'll get
luminescent light effects in time to the gaming
action.</description>
<price>139</price>
<image>assets/pic/Nokia_3100_blue.gif</image>
<series>3000</series>
<triband>true</triband>
<camera>false</camera>
<video>false</video>
<highlight1>Glow-in-the-dark</highlight1>
<highlight2>Flashing lights</highlight2>
</product>
<product productId="3">
<name>Nokia 3100 Pink</name>
<description>Light up the night with a
glow-in-the-dark cover - when it's charged with light you can
easily find your phone in the dark. When you get a call, the Nokia
3100 phone flashes in tune with your ringing tone. And when you
snap on a Nokia Xpress-on™ gaming cover*, you'll get
luminescent light effects in time to the gaming
action.</description>
<price>139</price>
<image>assets/pic/Nokia_3100_pink.gif</image>
<series>3000</series>
<triband>true</triband>
<camera>false</camera>
<video>false</video>
<highlight1>Glow-in-the-dark</highlight1>
<highlight2>Flashing lights</highlight2>
</product>
<product productId="4">
<name>Nokia 3120</name>
<description>Designed for both business and pleasure,
the elegant Nokia 3120 phone offers a pleasing mix of features.
Enclosed within its chic, compact body, you will discover the
benefits of tri-band compatibility, a color screen, MMS, XHTML
browsing, cheerful screensavers, and much more.</description>
<price>159.99</price>
<image>assets/pic/Nokia_3120.gif</image>
<series>3000</series>
<triband>true</triband>
<camera>false</camera>
<video>false</video>
<highlight1>Multimedia messaging</highlight1>
<highlight2>Animated screensavers</highlight2>
</product>
<product productId="5">
<name>Nokia 3220</name>
<description>The Nokia 3220 phone is a fresh new cut
on some familiar ideas - animate your MMS messages with cute
characters, see the music with lights that flash in time with your
ringing tone, download wallpapers and screensavers with matching
color schemes for the interface.</description>
<price>159.99</price>
<image>assets/pic/Nokia_3220.gif</image>
<series>3000</series>
<triband>false</triband>
<camera>true</camera>
<video>false</video>
<highlight1>MIDI tones</highlight1>
<highlight2>Cut-out covers</highlight2>
</product>
</catalog>
</mx:XML>
</mx:Application>It should work the same way.
What problem are you having?
Tracy
Maybe you are looking for
-
When i connect my iphone 5 to cpu, i cant figure out how to see the music held on phone. When I click the "iphone" icon, it pulls up the options (summary, info, music, apps, etc) but when i click music, it just gives sync options. When i plug in an
-
Consuming Synchronous RESTful Web Service with PI
Dear experts, i have a scenario for consuming RESTful web service. i have followed all the steps showed in the following link for configuring my interface. http://scn.sap.com/community/pi-and-soa-middleware/blog/2012/08/11/calling-synchronous-restful
-
Translating Web Dynpro Standard Components texts ?
Hello I am testing NWDW 7.0 SP3 and i want to make a Web application in my own language (Serbian, Serbo - Croatian). I have found a lot of documentation about creating international Web Dynpro applications where developers can translate their own tex
-
How to start free trial after download in photoshop
i have downloaded the Free trial version of photoshop but i have no idea how to start doing work with the free trial. Help????
-
My ethernet port on the thunderbolt display doesn't work anymore.
I recently updated to 10.8.4 on a Mac book pro. I use it docked on a thunderbolt display. The ethernet cable is plugged into the display. Today I switch the computer on and the dot for ethernet remains orange with "etat inconnu". I tried to reboot, u