Trouble with Swift, Auto Layout, and stack views











up vote
0
down vote

favorite












I’ve been working on an app with a grid of buttons. The grid consists of 4 buttons per row, and (currently) 6 rows. In the storyboard, each row of buttons is in a horizontal stack view, and all 6 stack views are in a vertical stack view.



I don’t want all of the buttons to be visible all the time, so I’m turning them on and off with .isHidden. This is causing some problems when I run the app in the simulator:




  1. I want all of the buttons to stay the same size, but if one or more buttons in a given row / stack view are hidden, the remaining buttons in that row adjust their sizes to fill the row. I’m guessing that a combination of constraints on the buttons and settings on the stack view will solve this, but I haven’t come up with the right combination yet.


  2. If I start with, say, the first 3 rows of buttons all unhidden, then try to unhide a button in one of the other rows, all of the buttons disappear. However, if I ‘print’ the .isHidden state of each button, the ones that should be visible have .isHidden = false.



Any ideas for solving either of these problems?



Thanks in advance for any assistance.










share|improve this question
























  • Please add a code block that you tried for the approach so that it will be helpful for the community to help you better.
    – Akhilesh krishnan
    Nov 10 at 6:29










  • I don’t think it’s really a ‘code’ problem. I could post the loop over the outlet collection of buttons, setting button.isHidden = true/false, but it looks like the problem is with auto layout and/or stack view settings.
    – DJR
    Nov 12 at 2:48










  • @DJR - for your 1. issue.... show what you want to happen. If you have 4 equal width buttons, and you hide / remove the 3rd button, how should it look?
    – DonMag
    Nov 13 at 14:18










  • For problem 1, I want all 4 buttons to keep the same size and position.
    – DJR
    Nov 13 at 20:42










  • @DJR - Is this what you want? 4 equal-width buttons... remove 3rd button, buttons 1, 2 and 4 remain at current size and positions? imgur.com/a/mwp5TN3
    – DonMag
    Nov 13 at 20:56















up vote
0
down vote

favorite












I’ve been working on an app with a grid of buttons. The grid consists of 4 buttons per row, and (currently) 6 rows. In the storyboard, each row of buttons is in a horizontal stack view, and all 6 stack views are in a vertical stack view.



I don’t want all of the buttons to be visible all the time, so I’m turning them on and off with .isHidden. This is causing some problems when I run the app in the simulator:




  1. I want all of the buttons to stay the same size, but if one or more buttons in a given row / stack view are hidden, the remaining buttons in that row adjust their sizes to fill the row. I’m guessing that a combination of constraints on the buttons and settings on the stack view will solve this, but I haven’t come up with the right combination yet.


  2. If I start with, say, the first 3 rows of buttons all unhidden, then try to unhide a button in one of the other rows, all of the buttons disappear. However, if I ‘print’ the .isHidden state of each button, the ones that should be visible have .isHidden = false.



Any ideas for solving either of these problems?



Thanks in advance for any assistance.










share|improve this question
























  • Please add a code block that you tried for the approach so that it will be helpful for the community to help you better.
    – Akhilesh krishnan
    Nov 10 at 6:29










  • I don’t think it’s really a ‘code’ problem. I could post the loop over the outlet collection of buttons, setting button.isHidden = true/false, but it looks like the problem is with auto layout and/or stack view settings.
    – DJR
    Nov 12 at 2:48










  • @DJR - for your 1. issue.... show what you want to happen. If you have 4 equal width buttons, and you hide / remove the 3rd button, how should it look?
    – DonMag
    Nov 13 at 14:18










  • For problem 1, I want all 4 buttons to keep the same size and position.
    – DJR
    Nov 13 at 20:42










  • @DJR - Is this what you want? 4 equal-width buttons... remove 3rd button, buttons 1, 2 and 4 remain at current size and positions? imgur.com/a/mwp5TN3
    – DonMag
    Nov 13 at 20:56













up vote
0
down vote

favorite









up vote
0
down vote

favorite











I’ve been working on an app with a grid of buttons. The grid consists of 4 buttons per row, and (currently) 6 rows. In the storyboard, each row of buttons is in a horizontal stack view, and all 6 stack views are in a vertical stack view.



I don’t want all of the buttons to be visible all the time, so I’m turning them on and off with .isHidden. This is causing some problems when I run the app in the simulator:




  1. I want all of the buttons to stay the same size, but if one or more buttons in a given row / stack view are hidden, the remaining buttons in that row adjust their sizes to fill the row. I’m guessing that a combination of constraints on the buttons and settings on the stack view will solve this, but I haven’t come up with the right combination yet.


  2. If I start with, say, the first 3 rows of buttons all unhidden, then try to unhide a button in one of the other rows, all of the buttons disappear. However, if I ‘print’ the .isHidden state of each button, the ones that should be visible have .isHidden = false.



Any ideas for solving either of these problems?



Thanks in advance for any assistance.










share|improve this question















I’ve been working on an app with a grid of buttons. The grid consists of 4 buttons per row, and (currently) 6 rows. In the storyboard, each row of buttons is in a horizontal stack view, and all 6 stack views are in a vertical stack view.



I don’t want all of the buttons to be visible all the time, so I’m turning them on and off with .isHidden. This is causing some problems when I run the app in the simulator:




  1. I want all of the buttons to stay the same size, but if one or more buttons in a given row / stack view are hidden, the remaining buttons in that row adjust their sizes to fill the row. I’m guessing that a combination of constraints on the buttons and settings on the stack view will solve this, but I haven’t come up with the right combination yet.


  2. If I start with, say, the first 3 rows of buttons all unhidden, then try to unhide a button in one of the other rows, all of the buttons disappear. However, if I ‘print’ the .isHidden state of each button, the ones that should be visible have .isHidden = false.



Any ideas for solving either of these problems?



Thanks in advance for any assistance.







swift autolayout storyboard stackview






share|improve this question















share|improve this question













share|improve this question




share|improve this question








edited Nov 10 at 11:48









Austin Conlon

56213




56213










asked Nov 10 at 5:52









DJR

12




12












  • Please add a code block that you tried for the approach so that it will be helpful for the community to help you better.
    – Akhilesh krishnan
    Nov 10 at 6:29










  • I don’t think it’s really a ‘code’ problem. I could post the loop over the outlet collection of buttons, setting button.isHidden = true/false, but it looks like the problem is with auto layout and/or stack view settings.
    – DJR
    Nov 12 at 2:48










  • @DJR - for your 1. issue.... show what you want to happen. If you have 4 equal width buttons, and you hide / remove the 3rd button, how should it look?
    – DonMag
    Nov 13 at 14:18










  • For problem 1, I want all 4 buttons to keep the same size and position.
    – DJR
    Nov 13 at 20:42










  • @DJR - Is this what you want? 4 equal-width buttons... remove 3rd button, buttons 1, 2 and 4 remain at current size and positions? imgur.com/a/mwp5TN3
    – DonMag
    Nov 13 at 20:56


















  • Please add a code block that you tried for the approach so that it will be helpful for the community to help you better.
    – Akhilesh krishnan
    Nov 10 at 6:29










  • I don’t think it’s really a ‘code’ problem. I could post the loop over the outlet collection of buttons, setting button.isHidden = true/false, but it looks like the problem is with auto layout and/or stack view settings.
    – DJR
    Nov 12 at 2:48










  • @DJR - for your 1. issue.... show what you want to happen. If you have 4 equal width buttons, and you hide / remove the 3rd button, how should it look?
    – DonMag
    Nov 13 at 14:18










  • For problem 1, I want all 4 buttons to keep the same size and position.
    – DJR
    Nov 13 at 20:42










  • @DJR - Is this what you want? 4 equal-width buttons... remove 3rd button, buttons 1, 2 and 4 remain at current size and positions? imgur.com/a/mwp5TN3
    – DonMag
    Nov 13 at 20:56
















Please add a code block that you tried for the approach so that it will be helpful for the community to help you better.
– Akhilesh krishnan
Nov 10 at 6:29




Please add a code block that you tried for the approach so that it will be helpful for the community to help you better.
– Akhilesh krishnan
Nov 10 at 6:29












I don’t think it’s really a ‘code’ problem. I could post the loop over the outlet collection of buttons, setting button.isHidden = true/false, but it looks like the problem is with auto layout and/or stack view settings.
– DJR
Nov 12 at 2:48




I don’t think it’s really a ‘code’ problem. I could post the loop over the outlet collection of buttons, setting button.isHidden = true/false, but it looks like the problem is with auto layout and/or stack view settings.
– DJR
Nov 12 at 2:48












@DJR - for your 1. issue.... show what you want to happen. If you have 4 equal width buttons, and you hide / remove the 3rd button, how should it look?
– DonMag
Nov 13 at 14:18




@DJR - for your 1. issue.... show what you want to happen. If you have 4 equal width buttons, and you hide / remove the 3rd button, how should it look?
– DonMag
Nov 13 at 14:18












For problem 1, I want all 4 buttons to keep the same size and position.
– DJR
Nov 13 at 20:42




For problem 1, I want all 4 buttons to keep the same size and position.
– DJR
Nov 13 at 20:42












@DJR - Is this what you want? 4 equal-width buttons... remove 3rd button, buttons 1, 2 and 4 remain at current size and positions? imgur.com/a/mwp5TN3
– DonMag
Nov 13 at 20:56




@DJR - Is this what you want? 4 equal-width buttons... remove 3rd button, buttons 1, 2 and 4 remain at current size and positions? imgur.com/a/mwp5TN3
– DonMag
Nov 13 at 20:56












1 Answer
1






active

oldest

votes

















up vote
0
down vote













To answer your first question...



When you hide a view in a UIStackView, auto-layout treats it as if it is "gone" --- the stack view will re-layout its arrangedSubviews as if that view was never there to begin with.



If you want this result:



enter image description here



Your best bet is probably to set the .alpha property of that view / button to 0. It will be completely invisible (so, in effect, "hidden") and the stack view will retain its current layout. And, controls with .alpha = 0 do not respond to touches (so you can't tap the invisible button).



For your second question, I'd recommend you re-post that question on its own. Make sure to include the code you're using that is not having the desired result.



See: How to Ask






share|improve this answer





















  • Thanks for this, @DonMag. Last night, I arrived at a similar conclusion by setting the background color of the button to transparent. After switching to that approach, the second problem stopped happening, but I'm going to do more testing to make sure.
    – DJR
    Nov 14 at 18:44











Your Answer






StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");

StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});

function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});


}
});














draft saved

draft discarded


















StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53236358%2ftrouble-with-swift-auto-layout-and-stack-views%23new-answer', 'question_page');
}
);

Post as a guest















Required, but never shown

























1 Answer
1






active

oldest

votes








1 Answer
1






active

oldest

votes









active

oldest

votes






active

oldest

votes








up vote
0
down vote













To answer your first question...



When you hide a view in a UIStackView, auto-layout treats it as if it is "gone" --- the stack view will re-layout its arrangedSubviews as if that view was never there to begin with.



If you want this result:



enter image description here



Your best bet is probably to set the .alpha property of that view / button to 0. It will be completely invisible (so, in effect, "hidden") and the stack view will retain its current layout. And, controls with .alpha = 0 do not respond to touches (so you can't tap the invisible button).



For your second question, I'd recommend you re-post that question on its own. Make sure to include the code you're using that is not having the desired result.



See: How to Ask






share|improve this answer





















  • Thanks for this, @DonMag. Last night, I arrived at a similar conclusion by setting the background color of the button to transparent. After switching to that approach, the second problem stopped happening, but I'm going to do more testing to make sure.
    – DJR
    Nov 14 at 18:44















up vote
0
down vote













To answer your first question...



When you hide a view in a UIStackView, auto-layout treats it as if it is "gone" --- the stack view will re-layout its arrangedSubviews as if that view was never there to begin with.



If you want this result:



enter image description here



Your best bet is probably to set the .alpha property of that view / button to 0. It will be completely invisible (so, in effect, "hidden") and the stack view will retain its current layout. And, controls with .alpha = 0 do not respond to touches (so you can't tap the invisible button).



For your second question, I'd recommend you re-post that question on its own. Make sure to include the code you're using that is not having the desired result.



See: How to Ask






share|improve this answer





















  • Thanks for this, @DonMag. Last night, I arrived at a similar conclusion by setting the background color of the button to transparent. After switching to that approach, the second problem stopped happening, but I'm going to do more testing to make sure.
    – DJR
    Nov 14 at 18:44













up vote
0
down vote










up vote
0
down vote









To answer your first question...



When you hide a view in a UIStackView, auto-layout treats it as if it is "gone" --- the stack view will re-layout its arrangedSubviews as if that view was never there to begin with.



If you want this result:



enter image description here



Your best bet is probably to set the .alpha property of that view / button to 0. It will be completely invisible (so, in effect, "hidden") and the stack view will retain its current layout. And, controls with .alpha = 0 do not respond to touches (so you can't tap the invisible button).



For your second question, I'd recommend you re-post that question on its own. Make sure to include the code you're using that is not having the desired result.



See: How to Ask






share|improve this answer












To answer your first question...



When you hide a view in a UIStackView, auto-layout treats it as if it is "gone" --- the stack view will re-layout its arrangedSubviews as if that view was never there to begin with.



If you want this result:



enter image description here



Your best bet is probably to set the .alpha property of that view / button to 0. It will be completely invisible (so, in effect, "hidden") and the stack view will retain its current layout. And, controls with .alpha = 0 do not respond to touches (so you can't tap the invisible button).



For your second question, I'd recommend you re-post that question on its own. Make sure to include the code you're using that is not having the desired result.



See: How to Ask







share|improve this answer












share|improve this answer



share|improve this answer










answered Nov 14 at 13:12









DonMag

15.7k2926




15.7k2926












  • Thanks for this, @DonMag. Last night, I arrived at a similar conclusion by setting the background color of the button to transparent. After switching to that approach, the second problem stopped happening, but I'm going to do more testing to make sure.
    – DJR
    Nov 14 at 18:44


















  • Thanks for this, @DonMag. Last night, I arrived at a similar conclusion by setting the background color of the button to transparent. After switching to that approach, the second problem stopped happening, but I'm going to do more testing to make sure.
    – DJR
    Nov 14 at 18:44
















Thanks for this, @DonMag. Last night, I arrived at a similar conclusion by setting the background color of the button to transparent. After switching to that approach, the second problem stopped happening, but I'm going to do more testing to make sure.
– DJR
Nov 14 at 18:44




Thanks for this, @DonMag. Last night, I arrived at a similar conclusion by setting the background color of the button to transparent. After switching to that approach, the second problem stopped happening, but I'm going to do more testing to make sure.
– DJR
Nov 14 at 18:44


















draft saved

draft discarded




















































Thanks for contributing an answer to Stack Overflow!


  • Please be sure to answer the question. Provide details and share your research!

But avoid



  • Asking for help, clarification, or responding to other answers.

  • Making statements based on opinion; back them up with references or personal experience.


To learn more, see our tips on writing great answers.





Some of your past answers have not been well-received, and you're in danger of being blocked from answering.


Please pay close attention to the following guidance:


  • Please be sure to answer the question. Provide details and share your research!

But avoid



  • Asking for help, clarification, or responding to other answers.

  • Making statements based on opinion; back them up with references or personal experience.


To learn more, see our tips on writing great answers.




draft saved


draft discarded














StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53236358%2ftrouble-with-swift-auto-layout-and-stack-views%23new-answer', 'question_page');
}
);

Post as a guest















Required, but never shown





















































Required, but never shown














Required, but never shown












Required, but never shown







Required, but never shown

































Required, but never shown














Required, but never shown












Required, but never shown







Required, but never shown







這個網誌中的熱門文章

Tangent Lines Diagram Along Smooth Curve

Yusuf al-Mu'taman ibn Hud

Zucchini