---
title: ProductViewStyle
framework: storekit
role: symbol
role_heading: Protocol
path: storekit/productviewstyle
---

# ProductViewStyle

A type that specifies the appearance and interaction of In-App Purchase products within the view hierarchy.

## Declaration

```swift
@MainActor @preconcurrency protocol ProductViewStyle
```

## Overview

Overview To configure the in-app purchase product style for a view hierarchy, use the productViewStyle(_:) modifier. To create a custom style, declare a type that conforms to the ProductViewStyle protocol. Implement the makeBody(configuration:) method to return a view that composes the elements of the configuration that the system provides to your method. The following code example shows how to create a custom product view style: struct CustomProductViewStyle: ProductViewStyle {     func makeBody(configuration: Configuration) -> some View {         switch configuration.state {         // Add other cases here.         case .success(let product):             VStack(alignment: .center) {                 configuration.icon                 Text(product.displayName)                 Button(product.displayPrice) {}             }         }     } }

ProductView(id: "com.example.product")     .productViewStyle(CustomProductViewStyle())     // Add your code here.

## Topics

### Getting built-in product view styles

- [automatic](storekit/productviewstyle/automatic.md)
- [compact](storekit/productviewstyle/compact.md)
- [large](storekit/productviewstyle/large.md)
- [regular](storekit/productviewstyle/regular.md)

### Creating custom product views

- [makeBody(configuration:)](storekit/productviewstyle/makebody(configuration:).md)
- [ProductViewStyle.Configuration](storekit/productviewstyle/configuration.md)
- [Body](storekit/productviewstyle/body.md)

### Supporting types

- [AutomaticProductViewStyle](storekit/automaticproductviewstyle.md)
- [CompactProductViewStyle](storekit/compactproductviewstyle.md)
- [RegularProductViewStyle](storekit/regularproductviewstyle.md)
- [LargeProductViewStyle](storekit/largeproductviewstyle.md)

## Relationships

### Conforming Types

- [AutomaticProductViewStyle](storekit/automaticproductviewstyle.md)
- [CompactProductViewStyle](storekit/compactproductviewstyle.md)
- [LargeProductViewStyle](storekit/largeproductviewstyle.md)
- [RegularProductViewStyle](storekit/regularproductviewstyle.md)

## See Also

### Styling product views

- [productViewStyle(_:)](swiftui/view/productviewstyle(_:).md)
- [productIconBorder()](swiftui/view/producticonborder().md)
- [ProductViewStyleConfiguration](storekit/productviewstyleconfiguration.md)
