flex-issues mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From "Josh Tynjala (JIRA)" <j...@apache.org>
Subject [jira] [Updated] (FLEX-35322) Layout of NumericStepper is broken
Date Wed, 07 Jun 2017 17:51:18 GMT

     [ 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)

Mime
View raw message