2

I have two UITableViews.

Once the left one(for first level category) is clicked the right one(for second level) appears.

A UIView with one UILabel and one UIButton appears when the secondary category is clicked. This UIView is shown in the first screenshot. Two-level category is displayed in the UILabel(which says '미디어 > 작가 / 시나리오') and 'X' is a button to delete the category from the array containing it and hide the UIView.

enter image description here

I set the maximum number of categories by 3. The next one shows the second set of category; which is 7 pixels apart from the first UIView. Also, the height of the rounded rectangle view is 19.

enter image description here

If the second one is too long to put in the same line as the first one is in, the background UIView(light blue) should expand its height and make space for the second UIView. To handle this, I got the following codes executed when the second category is added. The margin between the upper and the lower should be 7 pixels too.I didn't add the code going back to single line because even the following one doesn't work as I want.

enter image description here

I want the result to be somewhat like this:

enter image description here

//tableViewBorder: a UIImageView to separate two UITableViews
//index: a UIView to show what level of category each UITableView is for; which says '1차 분야', '2차 분야' in the screenshot
//dffcltyBtnContainer: a UIView on the bottom of the view controller. it is set to be on the bottom by constraints and its height is fixed.
lightBlueView.frame.size.height = 45

index.frame.origin.y = lightBlueView.frame.maxY + 7

catTableView1.frame.origin.y = index.frame.maxY
catTableView2.frame.origin.y = index.frame.maxY
tableViewBorder.frame.origin.y = index.frame.maxY

catTableView1.frame.size.height = dffcltyBtnContainer.frame.minY -
    catTableView1.frame.minY - 44
catTableView2.frame.size.height = dffcltyBtnContainer.frame.minY -
    catTableView1.frame.minY - 44
tableViewBorder.frame.size.height = dffcltyBtnContainer.frame.minY -
    catTableView1.frame.minY - 44

The code work well when it is called in a UIButton action method. The next one shows what the result of the code above works in the button-triggered method. The height of the two UITableViews correctly decreased by the same amount of change of lightBlueView.

enter image description here

If the sum of two rounded rectangles plus 7 is bigger than the width of lightBlueView, the second one is supposed to go down..

However, this one does not work at all in the desired code block, as if it does not exist. 'lightBlueView' has its 19 pixels of height fixed by a constraint and so are its margins with other components with the same level in the UIView(the highest level in the view controller).**

I guess it is because the height of lightBlueView is set but not sure. Setting x and y coordinate of the second category view will be another big challenge thought but that isn't the issue now :(( What does not make the lightBlueView not change its height in the code block below? Or are their some better ways to implement what I want to do? Anything would be a big help to me. Thanks in advance.

//method 'displayResults' shows or hides UIViews for each selected category. I only change '.hidden' values in it.
//selectedResult1~3Text are UILabels.
//selectedCat is an array of struct with two Strings: prim and secn. This one has what categories are chosen.

switch selectedCats.count{
case 1:
    ///----change width of label----//
    selectedResult1Text.text =
        selectedCats[0].prim + " > " + selectedCats[0].secn
    selectedResult1Text.sizeToFit()
    ///----change width of label----//

    displayResults(true, d: false, t: false)
    break
case 2:
    ///----change width of label----//
    selectedResult2Text.text =
        selectedCats[1].prim + " > " + selectedCats[1].secn
    selectedResult2Text.sizeToFit()
    ///----change width of label----//

    catTableView1.frame.origin.y = index.frame.maxY
    catTableView2.frame.origin.y = index.frame.maxY
    tableViewBorder.frame.origin.y = index.frame.maxY

    catTableView1.frame.size.height = dffcltyBtnContainer.frame.minY -
        catTableView1.frame.minY - 44
    catTableView2.frame.size.height = dffcltyBtnContainer.frame.minY -
        catTableView1.frame.minY - 44
    tableViewBorder.frame.size.height = dffcltyBtnContainer.frame.minY -
        catTableView1.frame.minY - 44

    displayResults(true, d: true, t: false)            
    break
case 3:
    ///----change width of label----//
    selectedResult3Text.text =
        selectedCats[2].prim + " > " + selectedCats[2].secn
    selectedResult3Text.sizeToFit()
    ///----change width of label----//

    displayResults(true, d: true, t: true)
    break
default:
    displayResults(false, d: false, t: false)
    break}
Yeongchan Jeon
  • 499
  • 3
  • 18

0 Answers0