# 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 %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.electricbolt.co.nz/additional-reading/displaying-overridden-configuration.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.