> For the complete documentation index, see [llms.txt](https://docs.electricbolt.co.nz/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.electricbolt.co.nz/additional-reading/displaying-overridden-configuration.md).

# Displaying overridden  configuration

It is useful to display the currently applied overridden configuration in your app. We suggest you display this on your app's home screen.

The provided [<mark style="color:blue;">`APLConfigurationLabel`</mark>](https://www.electricbolt.co.nz/api/Classes/APLConfiguration.html) for UIKit (Swift, Objective-C), `.configurationView` modifier for SwiftUI and [<mark style="color:blue;">`APLConfigurationLabel`</mark>](https://pub.dev/documentation/appfigurateflutter/latest/appfigurateflutter/APLConfigurationLabel-class.html) (Dart) displays overridden configuration drawn in a vertical orientation attached to the left hand side of the screen as follows:

<img src="/files/Zyc1nLFYbfxKXVYKYRef" alt="" data-size="original">

{% tabs %}
{% tab title="Swift (UIKit)" %}
You can add the [<mark style="color:blue;">`APLConfigurationLabel`</mark>](https://www.electricbolt.co.nz/api/Classes/APLConfigurationLabel.html) to your view controller in a `viewDidLoad` like this:

```swift
override func viewDidLoad() {
    let label = APLConfigurationLabel(frame: .zero)
    label.center = CGPoint(x: 7, y: self.navigationController!.view.bounds.size.height / 2)
    self.navigationController!.view.addSubview(label)
}
```

{% endtab %}

{% tab title="SwiftUI" %}
You can add the `.configurationView` modifier to your SwiftUI view like this:

```swift
NavigationStack {
  ...your content...
}
.configurationView()
```

This `.configurationView` modifier is available for both iOS and watchOS.
{% endtab %}

{% tab title="Objective-C (UIKit)" %}
You can add the [<mark style="color:blue;">`APLConfigurationLabel`</mark>](https://www.electricbolt.co.nz/api/Classes/APLConfigurationLabel.html) to your view controller in a `viewDidLoad` like this:

```objectivec
- (void) viewDidLoad {
    APLConfigurationLabel* label = [[APLConfigurationLabel alloc] initWithFrame: CGRectZero];
    label.center = CGPointMake(7, self.navigationController.view.bounds.size.height / 2);
    [self.navigationController.view addSubview: label];
}
```

{% endtab %}

{% tab title="Dart (Flutter)" %}
Make the `body` of your page a [<mark style="color:blue;">`APLConfiguationLabel`</mark>](https://pub.dev/documentation/appfigurateflutter/latest/appfigurateflutter/APLConfigurationLabel-class.html), and set it's `child` to the original `body`:

```dart
...
  @override
  Widget build(BuildContext context) {
    var media = MediaQuery.of(context);
    var padding = media.padding.left == 0.0 ? 8.0 : media.padding.left;

    return Scaffold(
      appBar: AppBar(
        title: Text('Example'),
      ),
      body: APLConfigurationLabel(child:
        ListView(
...
```

{% endtab %}
{% endtabs %}

## Creating your own label

If `APLConfigurationLabel` is not sufficient for your needs, you can create your own label as follows:

{% tabs %}
{% tab title="Swift" %}

> Swift [<mark style="color:blue;">`APLAddConfigurationUpdatedListener`</mark>](https://www.electricbolt.co.nz/api/Functions.html#/c:@F@APLAddConfigurationUpdatedListener) example

```swift
extension MyLogonController: APLConfigurationUpdated {

    override func viewDidLoad() {
        APLAddConfigurationUpdatedListener(self)
    }

    func configurationUpdated(_ notification: Notification?) {
        label.text = APLConfiguration.shared().modifications
    }
...
```

{% endtab %}

{% tab title="Objective-C" %}

> Objective-C [<mark style="color:blue;">`APLAddConfigurationUpdatedListener`</mark>](https://www.electricbolt.co.nz/api/Functions.html#/c:@F@APLAddConfigurationUpdatedListener) example

```objectivec
@interface MyLogonController () <APLConfigurationUpdated>
@end

@implementation MyLogonController

- (void) viewDidLoad {
    APLAddConfigurationUpdatedListener(self);
}

- (void) configurationUpdated: (NSNotification*) notification {
    label.text = [[APLConfiguration sharedConfiguration] modifications];
}
...
```

{% endtab %}

{% tab title="Dart" %}

> Dart [<mark style="color:blue;">`APLAddConfigurationUpdatedListener`</mark>](https://pub.dev/documentation/appfigurateflutter/latest/appfigurateflutter/APLAddConfigurationUpdatedListener.html) example

```dart
class _MyLabelState extends State<MyLabel> {

  @override
  void initState() {
    super.initState();
    APLAddConfigurationUpdatedListener(configurationUpdated);
  }

  @override
  void dispose() {
    APLRemoveConfigurationUpdatedListener(configurationUpdated);
    super.dispose();
  }

  void configurationUpdated(String? action) {
    setState(() {});
  }
  
  @override
  Widget build(BuildContext context) {
    return Text('${APLNativeConfiguration.sharedConfiguration().modifications()}');
  }
...
```

{% endtab %}
{% endtabs %}