Skip to content

Conversation

@justinmc
Copy link
Contributor

This fixes a regression found while doing the roll where inputs with OutlineInputBorder and symmetrical padding don't center. This was caused by #34355.

The solution here is to treat OutlineInputBorder differently (as it was before the referenced PR) so that it ignores padding when centering, but considers padding when aligning elsewhere.

@justinmc justinmc added a: text input Entering text in a text field or keyboard related problems framework flutter/packages/flutter repository. See also f: labels. f: material design flutter/packages/flutter/material repository. labels Jun 21, 2019
@justinmc justinmc requested a review from HansMuller June 21, 2019 16:26
@justinmc justinmc self-assigned this Jun 21, 2019
Copy link
Contributor

@HansMuller HansMuller left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

//
// That means that if the padding is uneven, center is not the exact
// midpoint of top and bottom. To account for this, the points are
// interpolated between independently.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

the above center and below center alignments are interpolated independently

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks, I was struggling to not say "we" or "I" in this sentence haha.

}

// Interpolate between three stops using textAlignVertical. This is used to
// calculate the outline baseline, which ignores padding for its middle but
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ignores padding when the alignment is middle and interpolates between the centered text box's top and the top of the content padding when the alignment is less than zero [etc...]

if (textAlignVertical.y <= 0) {
// It's possible for begin, middle, and end to not be in order because of
// excessive padding. Those cases are handled by using middle.
if (begin >= middle) {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

NICE catch

@justinmc justinmc merged commit 63438b9 into flutter:master Jun 21, 2019
@justinmc justinmc deleted the vertical-alignment-regression branch June 21, 2019 18:24
@alocher
Copy link

alocher commented Jun 22, 2019

@justinmc I'm not really sure how, but is it possible that this change caused webview_flutter to no longer vertically center web content correctly? This seems to have started with 1.7.6 and is fine in 1.7.5.

Simple example with a webview going to a page with vertical centering. 1.7.5 shows correctly and 1.7.6 pushes everything to the top.

return Container(
        child: WebView(
      initialUrl: 'https://www.w3.org/Style/Examples/007/center-example.en.html'),
    ));

@justinmc
Copy link
Contributor Author

Weird, I wouldn't think so... @collinjackson is it possible there is any connection between InputDecorator alignment and webview_flutter?

johnsonmh pushed a commit to johnsonmh/flutter that referenced this pull request Jul 30, 2019
Change the way outlined inputs vertically align their text to be more similar to how it used to be before a refactor. Fixes an edge case uncovered by a SCUBA test.
@github-actions github-actions bot locked as resolved and limited conversation to collaborators Aug 6, 2021
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

a: text input Entering text in a text field or keyboard related problems f: material design flutter/packages/flutter/material repository. framework flutter/packages/flutter repository. See also f: labels.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants