を表示していないSpark Panel Skinに基づいて作成したカスタムスキンを使用しているパネルがあります。このスキンでは、Spark Scrollerを表示グループ(「contentGroup」)に追加しました。このグループには、ラベルと画像がいくつかある「ListItems」が追加されています。フレックス4:Scrollerのコンテンツの一部が私のプロジェクトに
私は、垂直スクロールバーが下に到達したときに、静止画に見られるように示さするコンテンツがあることに気づいたときにすべてが今日それまでは正常に動作した
(私は画像を投稿することはできませんので、ここですリンク:http://s10.postimage.org/uwfqfqp15/Panel.jpg)
画像でわかるように、スクロールバーの垂直スクロールバーは最後に達していますが、まだ下限の下にあるものがあります(私の単純なカスタムスクロールバーが下に達していないことがわかります) 。ここで
は、パネルスキンコード(スクロール部)の一部です:
PanelSkin.mxml:
<s:Group id="algoGroup" x="0" y="0" width="100%" height="100%" minWidth="0" minHeight="0">
<s:Scroller id="contentScroller" x="0" y="0" width="85%" height="100%" minWidth="0" minHeight="0">
<s:Group id="contentGroup" x="0" y="0" width="85%" height="100%" minWidth="0" minHeight="0">
</s:Group>
</s:Scroller>
<componentes:customScroller id="contentScrollbar" x="10" y="10" width="10%" height="100%"/>
</s:Group>
ListaItem.mxml:
<?xml version="1.0" encoding="utf-8"?>
<s:Group xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
contentBackgroundAlpha="0.0"
currentState="Horizontal"
width.Horizontal="200" height.Horizontal="100"
height.Vertical="260" width.Vertical="128">
<s:states>
<s:State name="Horizontal"/>
<s:State name="Vertical"/>
</s:states>
<fx:Declarations>
<fx:Script>
<![CDATA[
import objectos.GlobalVars;
/*Vars - State -> Vertical
Bindable Vars -- Omitted
*/
public var ID:Number = -1;
public function resize(nW:Number, nH:Number):void
{
if(this.currentState == "Vertical")
{
_realIW = _iW2 = (_iW2 * nW)/_w2;
_realIH = _iH2 = (_iH2 * nH)/_h2;
if(_iW2 > _iH2)
_iW2 = _iH2;
else
_iH2 = _iW2;
_xImg = (_xImg * nW)/_w2;
_yImg = (_yImg * nH)/_h2;
_xTit = (_xTit * nW)/_w2;
_yTit = (_yTit * nH)/_h2;
Titulo.width = (Titulo.width * nW)/_w2;
Titulo.setStyle("fontSize", (GlobalVars.instance.getGlobal("fontSize") * 0.9));
_xDes = (_xDes * nW)/_w2;
if(Titulo.measureText(Titulo.text).width > Titulo.width)
_yDes = (_yDes * nH)/_h2;
else
_yDes = Titulo.y + Titulo.measureText(Titulo.text).height;
Descricao.width = (Descricao.width * nW)/_w2;
Descricao.setStyle("fontSize", (GlobalVars.instance.getGlobal("fontSize") * 0.7));
_xPre = (_xPre * nW)/_w2;
_yPre = (_yPre * nH)/_h2;
Preco.width = (Preco.width * nW)/_w2;
_xIco = (_xIco * nW)/_w2;
_yIco = (_yIco * nH)/_h2;
IconEspecial.width = (IconEspecial.width * nW)/_w2;
IconEspecial.height = (IconEspecial.height * nH)/_h2;
_xDeL = (_xDeL * nW)/_w2;
_yDeL = (_yDeL * nH)/_h2;
DescricaoL.width = (DescricaoL.width * nW)/_w2;
DescricaoL.setStyle("fontSize", (GlobalVars.instance.getGlobal("fontSize") * 0.7));
}
else
{
_realIW = _iW = (_iW * nW)/_w;
_realIH = _iH = (_iH * nH)/_h;
if(_iW > _iH)
_iW = _iH;
else
_iH = _iW;
Imagem.x = (Imagem.x * nW)/_w;
Imagem.y = (Imagem.y * nH)/_h;
Titulo.x = (Titulo.x * nW)/_w;
Titulo.y = (Titulo.y * nH)/_h;
Titulo.width = (Titulo.width * nW)/_w;
Titulo.setStyle("fontSize", (GlobalVars.instance.getGlobal("fontSize") * 0.9));
Descricao.x = (Descricao.x * nW)/_w;
Descricao.y = (Descricao.y * nH)/_h;
Descricao.width = (Descricao.width * nW)/_w;
Descricao.setStyle("fontSize", (GlobalVars.instance.getGlobal("fontSize") * 0.7));
Preco.x = (Preco.x * nW)/_w;
Preco.y = (Preco.y * nH)/_h;
Preco.width = (Preco.width * nW)/_w;
IconEspecial.x = (IconEspecial.x * nW)/_w;
IconEspecial.y = (IconEspecial.y * nH)/_h;
IconEspecial.width = (IconEspecial.width * nW)/_w;
IconEspecial.height = (IconEspecial.height * nH)/_h;
_sW = (_sW * nW)/_w;
_sY = (_sY * nH)/_h;
}
}
private function resizeImg():void
{
var ratio:Number = Imagem.contentWidth/Imagem.contentHeight;
if(Imagem.contentWidth > Imagem.contentHeight)
{
if(this.currentState == "Vertical")
{
Imagem.width = _iW2;
Imagem.height = _iW2/ratio;
}
else
{
Imagem.width = _iW;
Imagem.height = _iW/ratio;
}
}
else
{
if(Imagem.contentHeight > Imagem.contentWidth)
{
if(this.currentState == "Vertical")
{
Imagem.height = _iH2;
Imagem.width = _iH2 * ratio;
}
else
{
Imagem.height = _iH;
Imagem.width = _iH * ratio;
}
}
else
{
if(this.currentState == "Vertical")
{
Imagem.height = (_iH2 > _iW2)?_iW2:_iH2;
Imagem.width = ((_iH2 > _iW2)?_iW2:_iH2) * ratio;
}
else
{
Imagem.height = (_iH > _iW)?_iW:_iH;
Imagem.width = ((_iH > _iW)?_iW:_iH) * ratio;
}
}
}
Imagem.x += (_realIW - Imagem.width)/2;
Imagem.y += (_realIH - Imagem.height)/2;
}
public function get useBar():Boolean
{
if(Separador != null)
return Separador.visible;
else
return false;
}
public function set useBar(value:Boolean):void
{
if(Separador != null)
Separador.visible = value;
}
]]>
</fx:Script>
<mx:Image id="Imagem" x.Horizontal="10" y.Horizontal="10" x.Vertical="{_xImg}" y.Vertical="{_yImg}" maintainAspectRatio="false" complete.Horizontal="resizeImg()" complete.Vertical="resizeImg()"/>
<s:Label id="Titulo" x="98" y="10" text="Label" width="102" maxDisplayedLines="2" x.Vertical="{_xTit}" y.Vertical="{_yTit}" verticalAlign.Vertical="middle" textAlign.Vertical="left"/>
<s:Label id="Descricao" x="98" y="43" text="Label" width="102" maxDisplayedLines="3" color="#999999" x.Vertical="{_xDes}" y.Vertical="{_yDes}"/>
<s:Label id="Preco" x="113" y="78" text="Label" width="87" maxDisplayedLines="1" x.Vertical="{_xPre}" y.Vertical="{_yPre}"/>
<mx:Image x="93" y="73" width="20" height="20" id="IconEspecial" x.Vertical="{_xIco}" y.Vertical="{_yIco}"/>
<mx:HRule id="Separador" x="0" y="{_sY}" width="{_sW}" strokeColor="#000000" shadowColor="#000000" includeIn="Horizontal"/>
<s:Label id="DescricaoL" x.Horizontal="1" y.Horizontal="177" x.Vertical="{_xDeL}" y.Vertical="{_yDeL}" text="Label" width="127" color="#999999" visible.Horizontal="false" maxDisplayedLines="3"/>
</s:Group>
ここではコードですコンポーネントを動的に追加するために使用されます(関連するパーツのみを含むように編集されています):
var item:ListaItem = new ListaItem();
var iW:Number = 0;
var iH:Number = 0;
if(yPos == -1 || xPos == -1)
{
yPos = 0 - ((_group.height - (10 * (_maxProdutosVisiveis - 1)))/_maxProdutosVisiveis) - 10;
xPos = 0;
}
yPos += ((_group.height - (10 * (_maxProdutosVisiveis - 1)))/_maxProdutosVisiveis) + 10;
xPos = 0;
iW = _group.width;
iH = ((_group.height - (10 * (_maxProdutosVisiveis - 1)))/_maxProdutosVisiveis);
item.x = xPos;
item.y = yPos;
item.ID = obj.idProduto;
item.Titulo.text = (obj.Titulo_Produto != null)?obj.Titulo_Produto:obj.Titulo;
item.Descricao.text = obj.Descricao;
item.Preco.text = obj.Valor + " €";
item.IconEspecial.source = this.specialIcon;
_margem = iH + 10;
item.addEventListener(MouseEvent.CLICK, goToApresentacao);
_group.addElement(item);
_components.addItem(item);
item.width = iW;
item.height = iH;
item.Imagem.source = obj.url;
_maxProdutosVisiveis
同時に obj
は、私は、関連するすべてのものが含まれていると思いますが、何か他のもののために気軽にListItemの
のためのデータを保持するオブジェクトである最大見える製品です。
この問題を解決する方法はありますか?
あなたの助け:)
私はあなたのすべてのコードを読んだわけではありませんが、それは実際に何をしているかにはあまりにも複雑すぎるようです。各項目のレイアウトをx、y、幅、高さに設定することはほとんど不可能です。たいていの場合、を使用してFlexにレイアウトをさせるほうがずっと簡単です。そこには何か小さなものもありません。 –
私はそれを使用しますが、これはコードの一部に過ぎません。コンポーネントはビルドされていますので、コンテンツは好きなように表示できます。たとえば、適切なプロパティを設定すると、リスト項目を "W" 。 解決済み:ListaItemでは、ルートコンポーネントにデフォルトの幅と高さを追加するのを忘れていました。 –
あなたの答えを解決した場合は、あなたの件名を "解決済み"と変更して答えを含めるように質問を編集しないでください。回答を正式な回答として投稿する。そのように選択します。 – JeffryHouser