Changing button's size based on its content's length, so the button keeps its shape - uibutton

I have a UIButton which is created programmatically (it can be customised from Interface Builder, though). It is a circular and it looks like this:
Now I'm working on Internationalization and I need to check it for Double-Length Pseudolanguage. The image above is taken when the app language is set to double-length pseudo, but as you can see, the button only shows one word. Here are the constraints of the button:
The title style of the button is plain, its text is centre-aligned, and the line break is set to "Word Wrap".
How to make the button keep its shape but to increase its size when needed (basically, to increase its width and height for the same amount, so it keeps being a circle), so for example, in this case to show two "Menu" words? If you know how to achieve this I would appreciate your help.

Try setting the content compression resistance on the button to required (1000) for horizontal and vertical. It will also depend on the stackViews above and below allowing for the size change.

Related

Objective C image click action

I have seen this in other programs and am trying to replicate it.
I have an image on one of my forms that someone can drag-and-drop an image into. I would like to allow the user to click on that image to pop up another dialog that they could instead select a "stock" image if they choose to.
I don't see an outlet I can use for the click and putting a transparent button over the top would defeat my ability to drag and drop an image on to it.
I realize I could just change the image to a button instead but I prefer to use an image if possible.
How can I make an image clickable?
This is OSX by the way, not IOS.
Quoting from another question:
By default, NSImageView doesn't react to -mouseDown:, or -mouseUp: like other NSControl subclasses (namely NSButton) do.
The solution is given in an answer elsewhere - subclass NSImageView and appropriately handle the click event (as linked).
Drag in the standard NSButton.
Uncheck the Bordered checkbox.
Clear the Title text.
Set the Image (and optionally, the alternate image).
Also, if you are using layout constraints to set button size to image view size, don't forget to set vertical hugging/compression resistance priorities to low values (say 1).

How to layout the UIlabel object according to design spec in iOS

I have some difficult time in creating iOS screen to match with visual design provided by design team.
The design team has provided the spacing info for each screen which shows how much space each text needs to be apart from other UI element on the screen. This is attached for your reference. You can see here that the two text labels "Activate Your Account" and "A Verification link...." are placed apart by 25px.
The same thing I am trying to achieve in the storyboard. I am attaching the storyboard screen snapshot for reference.
From this you can see that I cannot keep exactly 25px b/w the two text labels because for the following issue
The text font is custom font and I cannot load the same in storyboard. I have added the font file in the project, but when I try to open it in storyboard for UILabel, it doesn't list out. I am not sure why xcode doesn't show up. This makes me hard to resize the label's frame. If I try to decrease the empty space in the label (upper and lower part of the text), this will make label height less, but when I set the font programmatically, it doesn't fit in this small space.
When I try to increase the height of the label, the text inside the label starts displaying at the center leaving space at the top and bottom of the label frame.
So I want to know how to solve this problem. If anyone had this issues and sorted out, please let me know how to fix this.
Many Thanks
Your designers aren't speccing their designs correctly :) Show them how iOS renders text and have them spec their designs in the same way. This is what we do on the Facebook design team. I mocked up an example for you (each square is 4dp/8px).
http://i.stack.imgur.com/q4tZX.png

How to create labels with dynamic size in iOS 6 with autolayout

I'm having trouble with autolayout and labels that get their text set in the source code based on some external conditions. These layouts (portrait and landscape) look like this on the simulator:
http://imgur.com/l6Iirun
http://imgur.com/n7RwwSD
The second one is obviously not what I want it to be, the label with the URN should fill the whole screen.
I have a width constraint for the dynamic label added by Xcode which I can't get rid of even though the "Name"-label has a fixed width and all horizontal spaces are fixed as well which should logically rid me of the need to have a width constraint for the label containing the dynamic text.
Any help on how to achieve what I want? Thanks in advance!
It looks to me like your labels are not binding their trailing edge to the superview. In the lower right there is the little 'I beam' icon, click on your label and then that icon, the top of the menu should be 'Pin' and pick trailing edge to superview. The label should expand to fit the width of the screen, minus some padding. Once that is in place you should be able to remove the width constraint - although you may need to find it in the size inspector and select promote to user constraint before you can remove it.
If you don't see the pin menu, try going up to the top and picking Editor -> Pin and you should see it there.
If it is already pinned, try increasing the content compression resistance priority and decreasing the priority of the width - although if pinning it does not fix it then there is another constraint at play.

Controls change place and form size changes

I have designed a form in VB.NET. At design time I have placed two buttons on it.
When I run it, the form size looks smaller and the buttons I have placed at the bottom are not visible. Also the alignment of the text and picture box is also different from what I set at design time.
Computer at which I am running the form is using a different resolution.
change the properties (F4) of the buttons: in ANCHOR put Bottom, Right
your buttons will be tied to the bottom and the right of the screen, instead of to the top, left, which is the default.
Grab the screen size at runtime with
Dim screen as System.Windows.Forms.Screen = System.Windows.Forms.Screen.PrimaryScreen
and using a scale factor depending on the current size (in design), scale the window to match. Check the coordinates of the buttons by hand to make sure they are not outside of the visible portion of the window.
You may not have to leave this feature in if you can debug it to the point that you know the exact resolution that you need.

VB.NET: Scrollbar "button"?

I plan on using a scrollbar for, well, scrolling an image. The image is 200x500, however, the only visible area is 200x250.
So I set the max value to 250, and the min value to 0. The idea is that if I drag the scrollbar's button to the bottom, 250 pixels will have moved for the image, right?
But wait, the scrollbar's button is.... very small. And the scrollbar is actually pretty long. Is there a way to make the scrollbar's button longer?
How did you create this scrollbar? Is it a separate control all together, or it is a component of another control? I do know that scrollbars added separately act kinda funny at times.
What I would suggest is using the scollbars built into another container control, which should achieve the exact same effect.
Create a new panel control on your form, and name it. (I suggest something like panelPicture)
Position the panel where you want your picture to be.
Set the panel's size to 200x250.
Set the panel's "Autoscroll" property to True.
Put a PictureBox inside this panel, and name it. (I suggest something like picMyPicture.)
Set the PictureBox's position to 0, 0.
Set the PictureBox's size to 200x500 (or whatever is necessary).
Set the PictureBox's Image property as desired.
Now, the scrollbar should automatically appear on the picture, and it should look normal.
As a side note (which may or may not be relevant), users typically don't like having to scroll to see the rest of an image, so if you don't need the user to scroll down on the image for some definitive purpose (or because you don't know what the size of the image that will be handled is), I'd try and change the size of things on your form so scrolling will not be necessary.
I hope this helps!