āāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāā ā š shadcn/directory/clerk/clerk-docs/reference/components/user/user-profile-view ā āāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāā
āāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāā
ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā
title: 'UserProfileView'
description: Clerk's UserProfileView component renders a beautiful, full-featured account management UI that allows users to manage their profile and security settings.
sdk: ios
{{ style: { maxWidth: '460px' } }}
The UserProfileView component renders a comprehensive user profile interface that displays user information and provides account management options. It includes personal information, security settings, account switching, and sign-out functionality.
[!IMPORTANT] The
UserProfileViewonly appears when a user is signed in.
Parameters
<Properties> - `isDismissable` - `Bool`Whether the view can be dismissed by the user. When true, a dismiss button appears in the navigation bar and the view can be used in sheets or other dismissable contexts. When false, no dismiss button is shown, making it suitable for full-screen usage. Defaults to true.
</Properties>
Usage
The following examples show how to use the UserProfileView component in your iOS app.
Dismissible sheet presentation
Present UserProfileView as a dismissible sheet when you want users to be able to close the profile view and return to the previous screen.
struct MainView: View {
@Environment(\.clerk) private var clerk
@State private var profileIsPresented = false
var body: some View {
VStack {
if clerk.user != nil {
Button("Show Profile") {
profileIsPresented = true
}
}
}
.sheet(isPresented: $profileIsPresented) {
UserProfileView()
}
}
}
Full-screen profile view
Use UserProfileView as a full-screen view when you want to dedicate the entire screen to profile management.
struct ProfileView: View {
@Environment(\.clerk) private var clerk
var body: some View {
if clerk.user != nil {
UserProfileView(isDismissable: false)
}
}
}
Customization
<Include src="_partials/ios/customization" />ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā
āāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāā