CODEWITHSUNDEEP
apache-flexactionscript-3
Mads610
Mads610

Reputation: 129

How to create customized component?

I want to create a data grid that has 4 columns: description, quantity, price, and line total. The line total will simply be the product of quantity & price. I want the last line of the grid to be the total of all line totals.

How can I create this type of grid? I thought of using item renderers, but I can't figure out how to have the last row be for the line items total.

If I must create a custom component, I'd appreciate book recommendations on custom component creation. While I have a general understanding of how to create custom components, I don't have a firm a grip on it as I'd like. Thanks.

Upvotes: 0

Views: 140

Answers (2)

Marty Pitt
Marty Pitt

Reputation: 29300

While you should definitely check out the links provided by www.Flextras.com, there are a couple of ways to provide the functionliaty you're after:

The simplest is a labelFunction:

<DataGrid dataProvider="{dp}">
     <columns>
         <DataGridColumn labelFunction="sumTotals" />
     </columns>
 </DataGrid>

 private function sumTotals(item:Object,column:DataGridColumn):String {
     return Number(item.quantity * item.price).toString();
 }

Alternatively, you could create your own itemRenderer, as follows:

  <!-- MyItemRenderer.mxml -->
 <mx:Label>
     <mx:Script>
         override public function set data(value:Object):void {
             super.data = value;
              this.label = Number(item.quantity * item.price).toString();
         }
     </mx:Script>
 </mx:Label>


 <!-- Your component -->
 <DataGrid dataProvider="{dp}">
     <columns>
         <DataGridColumn itemRenderer="MyItemRenderer"/>
     </columns>
 </DataGrid>

Upvotes: 1

JeffryHouser
JeffryHouser

Reputation: 39408

A Flex DataGrid cannot include items that are not in the dataProvider, so adding a row that includes the total of all line items in the DataGrid is not practical, without extending the DataGrid.

Take a look at this documentation for info about creating custom components. Also take a look at this screencast series. A direct link to episode 1.

Upvotes: 0

Related Questions