[
https://issues.apache.org/jira/browse/FLEX-35322?page=com.atlassian.jira.plugin.system.issuetabpanels:all-tabpanel
]
Josh Tynjala updated FLEX-35322:
--------------------------------
Attachment: Screen Shot 2017-06-07 at 10.47.56 AM.png
In a release0.8.0 nightly build from today, I'm still seeing issues with
NumericStepper. The buttons appear on the right side instead of below the text
input, but they're still super small. See the attached screenshot.
My code:
{code}
<?xml version="1.0" encoding="utf-8"?>
<js:Application xmlns:fx="http://ns.adobe.com/mxml/2009";
xmlns:js="library://ns.apache.org/flexjs/express"
xmlns:basic="library://ns.apache.org/flexjs/basic">
<js:initialView>
<js:View>
<js:style>
<basic:SimpleCSSStyles padding="10" />
</js:style>
<js:Panel title="Loan Payment Calculator">
<js:beads>
<js:VerticalLayoutWithPaddingAndGap
paddingTop="10"
paddingRight="10"
paddingBottom="10"
paddingLeft="10"
gap="6"/>
</js:beads>
<js:Group>
<js:beads>
<js:FlexibleFirstChildHorizontalLayout/>
</js:beads>
<js:Label text="Principal"/>
<js:Spacer width="6"/>
<js:NumericStepper
id="principalStepper"
minimum="0"
maximum="1000000000"
value="200000"
stepSize="1000"/>
</js:Group>
<js:Group>
<js:beads>
<js:FlexibleFirstChildHorizontalLayout/>
</js:beads>
<js:Label text="Interest"/>
<js:Spacer width="6"/>
<js:NumericStepper
id="interestStepper"
value="6.0"
minimum="0.1"
maximum="100.0"
stepSize="0.1"
snapInterval="0.1"/>
</js:Group>
<js:Group>
<js:beads>
<js:FlexibleFirstChildHorizontalLayout/>
</js:beads>
<js:Label text="Years"/>
<js:Spacer width="6"/>
<js:NumericStepper
id="yearsStepper"
value="15"
minimum="1"
maximum="50"
stepSize="1"/>
</js:Group>
<js:Label text="Payment: {resultText} per
month"/>
<js:TextButton text="Calculate Payment"
click="calcuatePaymentButton_onClick(event)"/>
</js:Panel>
</js:View>
</js:initialView>
<fx:Script>
<![CDATA[
[Bindable]
private var resultText:String = "1687.71";
private function calculatePayment(principal:Number,
interestRate:Number, years:int):Number
{
var effectiveInterestRate:Number = (interestRate / 100)
/ 12;
var totalPaymentCount:int = years * 12;
return principal * (effectiveInterestRate / (1 -
Math.pow(1 + effectiveInterestRate, -totalPaymentCount)))
}
private function
calcuatePaymentButton_onClick(event:MouseEvent):void
{
var principal:Number = this.principalStepper.value;
var interestRate:Number = this.interestStepper.value;
var years:int = this.yearsStepper.value;
var payment:Number = calculatePayment(principal,
interestRate, years);
this.resultText = payment.toFixed(2);
}
]]>
</fx:Script>
</js:Application>
{code}
> Layout of NumericStepper is broken
> ----------------------------------
>
> Key: FLEX-35322
> URL: https://issues.apache.org/jira/browse/FLEX-35322
> Project: Apache Flex
> Issue Type: Bug
> Environment: Windows 10
> Chrome 59.0.3071.82
> Firefox: 53.0.3 (32 bits)
> Reporter: Piotr Zarzycki
> Assignee: Peter Ent
> Fix For: Apache FlexJS 0.8.0
>
> Attachments: broken_numeric_stepper_layout.png, Screen Shot
> 2017-06-07 at 10.47.56 AM.png
>
>
> I just tried NumericStepper creating simple application
> {code}
> <?xml version="1.0" encoding="utf-8"?>
> <js:Application xmlns:fx="http://ns.adobe.com/mxml/2009";
> xmlns:js="library://ns.apache.org/flexjs/basic">
>
> <js:valuesImpl>
> <js:SimpleCSSValuesImpl/>
> </js:valuesImpl>
>
> <js:initialView>
> <js:View>
> <js:Group width="150" height="150">
> <js:NumericStepper width="100" height="30" minimum="0"
> maximum="10" stepSize="1"/>
> </js:Group>
> </js:View>
> </js:initialView>
> </js:Application>
> {code}
> Layout is being broken look into the screenshot->
> broken_numeric_stepper_layout.png
--
This message was sent by Atlassian JIRA
(v6.3.15#6346)
