Custom UI

Customize the UI components in your app

The VFCustomUIDelegate allows you to customize the UI components, by giving you direct references to them.

guard let preCommentsViewController = VFPreviewCommentsViewController.new(
    containerId: containerId,
    articleMetadata: articleMetadata,
    loginDelegate: self, settings: settings) else {
  return
}

preCommentsViewController.setCustomUIDelegate(customUIDelegate: self)
guard let newCommentViewController = VFNewCommentViewController.new(newCommentActionType: actionType, containerId: containerId, articleMetadata: articleMetadata, loginDelegate: self, settings: settings) else {
    return
}

newCommentViewController.setCustomUIDelegate(customUIDelegate: self)
guard let profileViewController = VFProfileViewController.new(userUUID: userUUID, presentationType: presentationType, loginDelegate: self, settings: settings) else {
  return
}

profileViewController.setCustomUIDelegate(customUIDelegate: self)

Implement the VFCustomUIDelegate.

extension ArticleViewController: VFCustomUIDelegate {
    func customizeView(view: VFCustomizableView) {
        switch view {
        case .postButton(let button):
            break
        default:
            break
        }
    }
}

Customizable views

Component

View name

Post button

postButton(let button)

Post text view

postTextView(let textField)

Post close image

postCloseImage(let image)

Post title

postTitle(let label)

Post placeholder label

postPlaceholderLabel(let label)

Post loading indicator (only shown on replies)

postLoadingView(let loadingView)

Comment cell date label

commentCellDateLabel(let label)

Comment cell name label

commentCellNameLabel(let label)

Comment cell content label

commentCellContentLabel(let label)

Comment cell like image

commentCellLikeImage(let image)

Comment cell like label

commentCellLikeLabel(let label)

Comment cell dislike image

commentCellDislikeImage(let image)

Comment cell dislike label

commentCellDislikeLabel(let label)

Comment cell reply label

commentCellReplyLabel(let label)

Preview empty comments view

previewEmptyCommentsView(let emptyCommentsView)

Preview see more comments button

previewSeeMoreCommentsButton(let button)

Preview title label

previewTitleLabel(let label)

Preview counter label

previewCounterLabel(let label)

Preview loading view

previewLoadingView(let loadingView)

Profile user name label

profileNameLabel(let label)

Profile logout label

profileLogoutLabel(let label)

Profile close image

profileCloseImage(let image)

Profile likes label

profileLikesLabel(let label)

Profile followers label

profileFollowersLabel(let label)


What’s Next
Did this page help you?