# Message Center inbox view

Show the complete Message Center inbox using MessageCenterView for an all-in-one view, MessageCenterContent for custom navigation, or a UIKit view controller.

The inbox view shows the complete Message Center: the message list and, when a message is selected, its content. Choose the view that matches how much control you need over navigation.

- `MessageCenterView` provides its own navigation and works on its own.
- `MessageCenterContent` provides only the content, so you supply the navigation.
- A UIKit view controller wraps `MessageCenterView` for UIKit apps.

## MessageCenterView

`MessageCenterView` is a complete Message Center with a built-in navigation stack. Place it anywhere in your SwiftUI hierarchy.


#### Swift


```swift
import SwiftUI
import AirshipMessageCenter

struct MyMessageCenterScreen: View {
    var body: some View {
        MessageCenterView()
    }
}
```



#### Objective-C


```objc
// Not available in Objective-C. Use a UIKit view controller (see below).
```




The initializer accepts a navigation style and an optional controller:

```swift
public init(navigationStyle: NavigationStyle = .auto, controller: MessageCenterController? = nil)
```


### Navigation styles

The `navigationStyle` parameter controls how the list and message panes are arranged:

```swift
// Adaptive: split view on iPad, stack on iPhone
MessageCenterView(navigationStyle: .auto)

// Single-column navigation on all devices
MessageCenterView(navigationStyle: .stack)

// Two-column master-detail layout on all devices
MessageCenterView(navigationStyle: .split)
```


- **`.auto`** (default): Uses split view on iPad and stack view on iPhone.
- **`.stack`**: Single-column navigation for all devices.
- **`.split`**: Two-column master-detail layout for all devices.

### Styling and filtering

Apply view modifiers to theme the view, filter messages, or replace the list item and message views:

```swift
MessageCenterView()
    .messageCenterTheme(theme)
    .messageCenterPredicate(CustomPredicate())
    .messageCenterItemViewStyle(CustomListItemViewStyle())
    .messageCenterMessageViewStyle(CustomMessageViewStyle())
```


- `.messageCenterTheme(_:)` applies a [theme](https://www.airship.com/docs/developer/sdk-integration/apple/message-center/getting-started/#applying-a-custom-theme).
- `.messageCenterPredicate(_:)` [filters messages](https://www.airship.com/docs/developer/sdk-integration/apple/message-center/custom/#filtering-messages) in this view only.
- `.messageCenterItemViewStyle(_:)` replaces the [list item view](https://www.airship.com/docs/developer/sdk-integration/apple/message-center/custom/list-view/#custom-list-item-view).
- `.messageCenterMessageViewStyle(_:)` replaces the [message view](https://www.airship.com/docs/developer/sdk-integration/apple/message-center/custom/message-view/#custom-message-view-style).

## MessageCenterContent

For full control over navigation, use `MessageCenterContent`, which provides the message list without a built-in navigation stack. It requires a `MessageCenterController` to keep the list and message state in sync.

Drive navigation with the controller's `path`, and provide a destination for the message route:


#### Swift


```swift
import SwiftUI
import AirshipMessageCenter

struct MyMessageCenterScreen: View {
    @StateObject
    private var controller = MessageCenterController()

    var body: some View {
        NavigationStack(path: $controller.path) {
            MessageCenterContent(controller: controller)
                .navigationTitle("Messages")
                .navigationDestination(for: MessageCenterController.Route.self) { route in
                    switch route {
                    case .message(let messageID):
                        MessageCenterMessageViewWithNavigation(messageID: messageID)
                    }
                }
        }
    }
}
```




`MessageCenterController` publishes its navigation state so you can respond to selection changes:

```swift
public enum Route: Sendable, Hashable {
    case message(String)
}

@Published public var path: [Route]

// Navigate to a message, or pass nil to pop to the list
public func navigate(messageID: String?)
```


To filter the messages shown, pass a predicate to the initializer:

```swift
MessageCenterContent(
    controller: controller,
    predicate: CustomPredicate()
)
```


## UIKit

For UIKit apps, create a view controller that hosts the Message Center. The factory returns a standard view controller you can present or push.


#### Swift


```swift
let viewController = MessageCenterViewControllerFactory.make(
    controller: MessageCenterController()
)

navigationController?.pushViewController(viewController, animated: true)
```



#### Objective-C


```objc
UIViewController *viewController = [UAMessageCenterViewControllerFactory make];
[self.navigationController pushViewController:viewController animated:YES];
```




To embed the Message Center inside an existing view controller in Objective-C, use `embed(in:)`, which adds the Message Center as a child and returns a container view:

```objc
UIView *messageCenterView = [UAMessageCenterViewControllerFactory embedIn:self];
[self.containerView addSubview:messageCenterView];
```