# 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) (Swift, Objective-C), [<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="https://1008176080-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fw1fcw3dvtSrfUh3YtO9Z%2Fuploads%2FogiCfPuclOoBQ2xVwz68%2FConfigurationLabelSmall.png?alt=media&#x26;token=f87ef9e3-0b00-4993-b72c-ef40d7e7f3fb" 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="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 %}