Network Security Internet Technology Development Database Servers Mobile Phone Android Software Apple Software Computer Software News IT Information

In addition to Weibo, there is also WeChat

Please pay attention

WeChat public account

Shulou

How to use the external Flex renderer in Flex rendering mechanism

2025-04-05 Update From: SLTechnology News&Howtos shulou NAV: SLTechnology News&Howtos > Development >

Share

Shulou(Shulou.com)06/02 Report--

This article mainly shows you "how to use the external Flex renderer in the Flex rendering mechanism". The content is easy to understand and clear. I hope it can help you solve your doubts. Let me lead you to study and learn how to use the external Flex renderer in the Flex rendering mechanism.

External Flex renderer for Flex rendering mechanism

The MXML tag and ActionScript code for this Flex renderer are in the same file as the list that uses the renderer. The code is inlined with the rest of the code in the file. You will recall that I said that the inline renderer should be treated as a separate class. In fact, the Flex compiler extracts this inline code and creates classes for you. The advantage of the inline renderer is that the code is in the same place as the list, but this becomes a disadvantage if the renderer becomes complex. In this article, I'll show you how to create your own classes.

There are several advantages to extracting the Flex renderer to an external file:

The ◆ renderer can be easily used in multiple lists

◆ code is easier to maintain

◆ can use FlexBuilder's Design view to draft the original renderer

MXML renderer

In part 1, you saw that there is a complex renderer for DataGrid:

Today) setStyle ("backgroundColor", 0xff99ff); elsesetStyle ("backgroundColor", 0xffffff);}] >

The ◆ Flex renderer is based on HBox, contains an Image and a Text, and sets the background color based on the pubDate field of the project record. You can use the following steps to write the same Flex renderer as an external file:

If you use FlexBuilder, create a new MXMLComponent file (I'll name my file GridColumnSimpleRenderer, and you can name it as you like) and set the root tag to HBox. Don't worry about the size.

If you only use SDK, create a new MXML file (name it GridColumnSimpleRenderer.mxml) and set the root tag to HBox.

Copy everything between and when the file is open, but do not copy those tags because they are already in the file. The result should be as follows:

Today) setStyle ("backgroundColor", 0xff99ff); elsesetStyle ("backgroundColor", 0xffffff);}] >

Save this file.

Now modify the DataGridColumn definition by removing the inline renderer and replacing it with the following:

Now run the application. You will be surprised. Because the line is very high. This is because of height= "300s" on the renderer.

◆ determines the width and height of the Flex renderer

The List control always sets the width of the renderer. The explicit width= "400s" will be ignored in this example. You should write your own renderer, assuming that the user changes the width of the column or list.

Height is another matter. If the list sets an explicit rowHeight, it imposes this height on the lines, ignoring any height you set for the renderer. However, if you set the variableRowHeight property of the list to true, the list carefully considers the height of the renderer. In this example, the height is explicitly set to 300, so each behavior is 300 pixels high.

To fix it, remove the explicit height from the renderer file and the application will run correctly.

These are all the contents of the article "how to use the external Flex renderer in the Flex rendering mechanism". Thank you for reading! I believe we all have a certain understanding, hope to share the content to help you, if you want to learn more knowledge, welcome to follow the industry information channel!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.

Views: 0

*The comments in the above article only represent the author's personal views and do not represent the views and positions of this website. If you have more insights, please feel free to contribute and share.

Share To

Development

Wechat

© 2024 shulou.com SLNews company. All rights reserved.

12
Report