FluentLayout / Cirrious.FluentLayout

FluentLayout for Xamarin.iOS - sample uses MvvmCross
Microsoft Public License
148 stars 54 forks source link

added the AspecRatio method #41

Closed LuoyeAn closed 6 years ago

LuoyeAn commented 6 years ago

This might be a cool one to pair with a slider to show it changing

we are unable to implement it in demo. Because that the Multiplier is a get property in NSLayoutConstraint class.

So we can just add a demo code to README.md

Cheesebaron commented 6 years ago

Not sure if the name of the method is still fitting.

This adds a constraint saying:

view.Width = aspect * view.Height

What if you want to handle that

view.Height = aspect * view.Width

Shouldn't there be two methods one for width and one for height?

LuoyeAn commented 6 years ago
var aspect =2f;
var aspectRatioLayout = label.WithAspectRatio(aspect);

View.AddConstraints(
    heightConstant.AtTopOf(View, margin),
    heightConstant.AtLeftOf(View, margin),
    heightConstant.AtRightOf(View, margin),

    label.AtLeftOf(View, margin),
    label.Below(heightConstant, margin),
    label.AtRightOf(View, margin)
);

label.AddConstraints(aspectRatioLayout);

above code means that view.Width = 2* view.Height

if we want to set that view.Height = 2* view.Width we just set the aspect to 0.5f. That's ok.

so value of aspect is width/height. How about it?

Cheesebaron commented 6 years ago

It is just not clear from the naming that you are applying the aspect ratio to the width and not height.

So when a random developer uses the WithAspectRatio method, they may think, what it actually does. So there are different ways to tackle this.

  1. be able to specify which dimension you want to apply the aspect ratio to in the single WithAspectRatio method
  2. make two distinct methods where the name indicates which dimension you are applying to
  3. both 1. and 2.
LuoyeAn commented 6 years ago

@Cheesebaron if we use xcode to add the Contraints, we will see the AspectRatio in designer, the default value of Multiplier is width/height.

https://gyazo.com/3f0ca9e3b255b814beda9db610e896fe https://gyazo.com/00fec9fdb07a57b64a3f2680c3dcd023

gshackles commented 6 years ago

Sorry for the delayed response, been hectic here heading into a vcation.

Aspect Ratio is pretty well defined as being the ratio of width to height so I think that part is fine, but I do think it's worth mentioning that in the comments on the method, just to make it extra clear for developers.

I'd also still like to see some sort of example added to the sample app here. 😄