UITableView grouped set background colour transparent

Question

This is what my view looks like :

And this is how I want it to be (ignoring the text color)

As you can see that the view between the headers should be cleared. But that's not happening.
This is how I am implementing the modal ViewController :

ActivityFilterViewController *filter = [[ActivityFilterViewController alloc] init];
    filter.view.backgroundColor = [UIColor clearColor];
    [filter setModalPresentationStyle:UIModalPresentationCurrentContext];
    [self presentViewController:filter animated:YES completion:nil];

ActivityFilterViewController :

I have set the UITableView as grouped and set the height of header and footer of sections as 10. And also cleared the background colour of the header views.

are you try to remove the background color of tableview or else bro — Anbu.Karthik, May 27 '16 at 12:27
@Anbu.Karthik : In the first screenshot, the gap between the sections is transparent, but in my implementation it is not. I want to set the gap in between the sections as transperent — Nitish, May 27 '16 at 12:31
@Nitish, Try to change the alpha content to 0.5 something you want. it will show like transparent view. — karthik, May 27 '16 at 12:44

score 1 · Answer 1 · answered Dec 15 '16 at 12:23

1

Try this:

viewDidLoad:

tableView.backgroundColor = [UIColor clearColor];

OR the above not working,

tableView.backgroundView = nil;

answered Dec 15 '16 at 12:23

Lal Krishna

15,485
6
64
84

score 0 · Answer 2 · answered May 27 '16 at 12:46

If ios version is lower then 8.0 then you should set modal presentationstyle to UIModalPresentationCurrentContext to self. something like,

   self.modalPresentationStyle = UIModalPresentationCurrentContext;

If you are using navigation controller then,

  self.nnavigationController.modalPresentationStyle = UIModalPresentationCurrentContext;

If two navihation controller to reach this view then,

 self.navigationController.navigationController.modalPresentationStyle = UIModalPresentationCurrentContext;

If ios version is greater or equal to 8.0 then modal presentation style should be UIModalPresentationOverCurrentContext and should set to View controller which you want to present like,

  filter.modalPresentationStyle = UIModalPresentationOverCurrentContext;

If you have made this setup then check your every layer's background color is set to clear color of filter VC.

You should debug view hierarchy to check that how many layers are there in between.

Hope this will help :)

score 0 · Answer 3 · answered May 30 '16 at 06:36

Use a custom view controller. Not an ActivityController. Design it however you like and present it with on the current context.

No need for a UITableView since your not scrolling it anyway.

Just use rounded corners for both subviews.

If you may hide one button at runtime you can use UIStackView so the layout will automatically change.

score 0 · Answer 4 · answered May 30 '16 at 13:42

You can add a subview with a UITableView to a UIAlertController.

1 Create the UIAlertController.

    UIAlertController *alertController = [UIAlertController alertControllerWithTitle:nil
                                                                   message:nil
                                                            preferredStyle:UIAlertControllerStyleActionSheet];

2 Create the Subview with the UITableView

    UIVisualEffect *blurEffect;
    blurEffect = [UIBlurEffect effectWithStyle:UIBlurEffectStyleLight];

    UIVisualEffectView *detailsView;
    //Let's match the cornerRadius the iOS Style
    if (SYSTEM_VERSION_GREATER_THAN_OR_EQUAL_TO(@"9.0")) {
        detailsView = [[UIVisualEffectView alloc] initWithFrame:CGRectMake(0, -120, alertController.view.frame.size.width-20, 110)];
        detailsView.layer.cornerRadius = 15;
    } else {
        detailsView = [[UIVisualEffectView alloc] initWithFrame:CGRectMake(0, -120, alertController.view.frame.size.width-16, 110)];
        detailsView.layer.cornerRadius = 5;
    }

    detailsView.effect = blurEffect;
    detailsView.layer.masksToBounds = YES;
    detailsView.alpha = 1;
    detailsView.backgroundColor = [[UIColor whiteColor] colorWithAlphaComponent:0.74];

    //Add the UITableView
    UITableView *menuTableView = [[UITableView alloc]initWithFrame:detailsView.frame style:UITableViewStylePlain];
    [detailsView addSubview:menuTableView];

3 Add the actions & Subview and present the UIAlertController

    UIAlertAction* resetAction = [UIAlertAction actionWithTitle:@"Reset to default"
                                                           style:UIAlertActionStyleDefault
                                                         handler:^(UIAlertAction * action){

    //Reset the switches in your UITableViewCells

    }];


    UIAlertAction* saveAction = [UIAlertAction actionWithTitle:@"Save"
                                                           style:UIAlertActionStyleCancel
                                                         handler:^(UIAlertAction * action){

    //Save 

    }];

    [alertController addAction:resetAction];
    [alertController addAction:saveAction];

    // Add the Subview with the UITableView
    [alertController.view addSubview:detailsView];

    [self presentViewController:alertController animated:YES completion:nil];

score 0 · Answer 5 · answered Jun 01 '16 at 23:15

Steps 1 & 2 below have already been said by others, but I'm going to say it here anyway for completeness of my answer.

Step 1, set the table view background to transparent:

self.tableView.backgroundColor = [UIColor clearColor];

Step 2, as you stated you already have, you must set the height by overriding the heightForHeaderInSection method (in your case, 10):

- (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section
{
    return 50.0;
}

Step 3, provide a custom view by overriding the viewForHeaderInSection method (note -- this is where you must set the background color to clear):

- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section
{
    UIView * header = [[UIView alloc] initWithFrame:CGRectMake(0,0,self.oTableView.frame.size.width, 10)];
    header.backgroundColor = [UIColor clearColor];

    return header;
}

Step 4, once you verify that this is, in fact, showing a transparent background (you'll see the view below this in the background just as you see above and on the sides of the table view), you then focus on creating the effect that you want at the top and bottom of the cells.

You can do this in one of two ways:

Modify your UITableViewCell implementation to create rounded corners (only top left and top right if the first cell in a section; only bottom left and bottom right if the last cell in a section).
Customize the custom view you are creating in the viewForHeaderInSection override to provide the rounded corner effects (add subviews to the header view that you return in this method), but this will add more space at the top (first cell) or top & bottom (last cell) of cells in a section.

UITableView grouped set background colour transparent

5 Answers5