Guides
Start typing to search…

Add a conversation to your app

Add a conversation container

  1. Create yourVFArticleMetadata object.
VFArticleMetadata articleMetadata = new VFArticleMetadata("https://test.com", "STORY TITLE", "STORY_DESC", "https://test.com");
val articleMetadata = VFArticleMetadata(URL(""), "STORY TITLE", "STORY_DESC", new URL("STORY_PICTURE_URL"));
  1. Create yourVFSettings object.
VFColors colors = new VFColors(ContextCompat.getColor(getApplicationContext(), R.color.colorPrimary), ContextCompat.getColor(getApplicationContext(), R.color.colorPrimaryLight), Color.WHITE);
VFSettings vfSettings = new VFSettings(colors);
val colors = VFColors(ContextCompat.getColor(getApplicationContext(), R.color.colorPrimary), ContextCompat.getColor(getApplicationContext(), R.color.colorPrimaryLight), Color.WHITE);
val vfSettings = VFSettings(colors);
  1. Add thePreviewCommentsFragment into your content .
VFPreviewCommentsFragment previewCommentsFragment = new VFPreviewCommentsFragmentBuilder(
                articleViewModel.getStory().getContainerId(),
                articleMetadata,
                vfSettings
)
.paginationSize(10)
.sortType(VFSortType.newest)
.build();

FragmentTransaction ft = getSupportFragmentManager().beginTransaction();
ft.replace(R.id.article_comments_container, previewCommentsFragment);
ft.commitAllowingStateLoss();

previewCommentsFragment.setActionCallback(this);
val previewCommentsFragment = VFPreviewCommentsFragmentBuilder(
                articleViewModel.getStory().getContainerId(),
                articleMetadata,
                vfSettings
)
.paginationSize(10)
.sortType(VFSortType.newest)
.build();
val ft = supportFragmentManager.beginTransaction()
ft.replace(R.id.article_comments_container, previewCommentsFragment)
ft.commitAllowingStateLoss()
  1. Listen to thePreviewCommentsFragment action callback .
@Override
public void onNewAction(VFActionType actionType, VFActionData action) {
    if (actionType == VFActionType.writeNewCommentPressed) {
        Intent intent = new Intent(getApplicationContext(), NewCommentActivity.class);
        intent.putExtra(IntentKeys.INTENT_CONTAINER_ID, articleViewModel.getStory().getContainerId());
        intent.putExtra(IntentKeys.INTENT_STORY_LINK, articleViewModel.getStory().getLink());
        intent.putExtra(IntentKeys.INTENT_STORY_TITLE, articleViewModel.getStory().getTitle());
        intent.putExtra(IntentKeys.INTENT_NEW_COMMENT_ACTION, action.getNewCommentAction().type.toString());
        if (action.getNewCommentAction().content != null) {
            intent.putExtra(IntentKeys.INTENT_NEW_COMMENT_CONTENT, action.getNewCommentAction().content.toString());
        }
        intent.putExtra(IntentKeys.INTENT_STORY_DESC, articleViewModel.getStory().getDescription());
        intent.putExtra(IntentKeys.INTENT_STORY_PICTUREURL, articleViewModel.getStory().getPictureUrl());
        startActivity(intent);
    } else if (actionType == VFActionType.openProfilePressed) {
        Intent intent = new Intent(getApplicationContext(), ProfileActivity.class);
        intent.putExtra(IntentKeys.INTENT_USER_UUID, action.getOpenProfileAction().userUUID.toString());
        if (action.getOpenProfileAction().presentationType != null) {
            intent.putExtra(IntentKeys.INTENT_USER_PRESENTATION_TYPE, action.getOpenProfileAction().presentationType.toString());
        }
        startActivity(intent);
    } else if (actionType == VFActionType.authPressed){
    		Intent intent = new Intent(getApplicationContext(), LoginActivity.class);
    		startActivity(intent);
    }
}
override fun onNewAction(actionType: VFActionType, action: VFActionData) {
    if (actionType == VFActionType.writeNewCommentPressed) {
        val intent = Intent(applicationContext, NewCommentActivity::class.java)
        intent.putExtra(IntentKeys.INTENT_CONTAINER_ID, articleViewModel!!.story.containerId)
        intent.putExtra(IntentKeys.INTENT_STORY_LINK, articleViewModel!!.story.link)
        intent.putExtra(IntentKeys.INTENT_STORY_TITLE, articleViewModel!!.story.title)
        intent.putExtra(
            IntentKeys.INTENT_NEW_COMMENT_ACTION,
            action.newCommentAction.type.toString()
        )
        if (action.newCommentAction.content != null) {
            intent.putExtra(
                IntentKeys.INTENT_NEW_COMMENT_CONTENT,
                action.newCommentAction.content.toString()
            )
        }
        intent.putExtra(IntentKeys.INTENT_STORY_DESC, articleViewModel!!.story.description)
        intent.putExtra(IntentKeys.INTENT_STORY_PICTUREURL, articleViewModel!!.story.pictureUrl)
        startActivity(intent)
    } else if (actionType == VFActionType.openProfilePressed) {
        val intent = Intent(applicationContext, ProfileActivity::class.java)
        intent.putExtra(
            IntentKeys.INTENT_USER_UUID,
            action.openProfileAction.userUUID.toString()
        )
        if (action.openProfileAction.presentationType != null) {
            intent.putExtra(
                IntentKeys.INTENT_USER_PRESENTATION_TYPE,
                action.openProfileAction.presentationType.toString()
            )
        }
        startActivity(intent)
    } else if (actionType == VFActionType.authPressed){
    		Intent intent = new Intent(getApplicationContext(), LoginActivity.class);
    		startActivity(intent);
    }
}

Type a new comment

  1. Create yourVFArticleMetadata object.
URL storyUrl = new URL(getIntent().getStringExtra(IntentKeys.INTENT_STORY_LINK));
URL pictureUrl = new URL(getIntent().getStringExtra(IntentKeys.INTENT_STORY_PICTUREURL));
VFArticleMetadata articleMetadata = new VFArticleMetadata(storyUrl, getIntent().getStringExtra(IntentKeys.INTENT_STORY_TITLE), getIntent().getStringExtra(IntentKeys.INTENT_STORY_DESC), pictureUrl);
  1. Create yourVFSettings object.
VFColors colors = new VFColors(ContextCompat.getColor(getApplicationContext(), R.color.colorPrimary), ContextCompat.getColor(getApplicationContext(), R.color.colorPrimaryLight), Color.WHITE);
VFSettings vfSettings = new VFSettings(colors);
val colors = VFColors(
    ContextCompat.getColor(applicationContext, R.color.colorPrimary),
    ContextCompat.getColor(
        applicationContext, R.color.colorPrimaryLight
    ),
    Color.WHITE
)
val vfSettings = VFSettings(colors)
  1. Create theVFNewCommentAction object.
VFNewCommentAction newCommentAction = null;

String newCommentActionType = getIntent().getStringExtra(IntentKeys.INTENT_NEW_COMMENT_ACTION);

if (newCommentActionType.equals(VFNewCommentAction.VFNewCommentActionType.create.toString())) {
    newCommentAction = new VFNewCommentAction(VFNewCommentAction.VFNewCommentActionType.create);
} else if (newCommentActionType.equals(VFNewCommentAction.VFNewCommentActionType.reply.toString())) {
    newCommentAction = new VFNewCommentAction(VFNewCommentAction.VFNewCommentActionType.reply);
} else if (newCommentActionType.equals(VFNewCommentAction.VFNewCommentActionType.edit.toString())) {
    newCommentAction = new VFNewCommentAction(VFNewCommentAction.VFNewCommentActionType.edit);
}

if (getIntent().getStringExtra(IntentKeys.INTENT_NEW_COMMENT_CONTENT) != null) {
    newCommentAction.content = UUID.fromString(getIntent().getStringExtra(IntentKeys.INTENT_NEW_COMMENT_CONTENT));
}
var newCommentAction: VFNewCommentAction ? = null
val newCommentActionType = intent.getStringExtra(IntentKeys.INTENT_NEW_COMMENT_ACTION)
if (newCommentActionType == VFNewCommentAction.VFNewCommentActionType.create.toString()) {
    newCommentAction = VFNewCommentAction(VFNewCommentAction.VFNewCommentActionType.create)
} else if (newCommentActionType == VFNewCommentAction.VFNewCommentActionType.reply.toString()) {
    newCommentAction = VFNewCommentAction(VFNewCommentAction.VFNewCommentActionType.reply)
} else if (newCommentActionType == VFNewCommentAction.VFNewCommentActionType.edit.toString()) {
    newCommentAction = VFNewCommentAction(VFNewCommentAction.VFNewCommentActionType.edit)
}
if (intent.getStringExtra(IntentKeys.INTENT_NEW_COMMENT_CONTENT) != null) {
    newCommentAction!!.content =
        UUID.fromString(intent.getStringExtra(IntentKeys.INTENT_NEW_COMMENT_CONTENT))
}
  1. Add theNewCommentFragment into your content .
VFNewCommentFragment newCommentFragment = new VFNewCommentFragmentBuilder(
                newCommentAction,
                getIntent().getStringExtra(IntentKeys.INTENT_CONTAINER_ID),
                articleMetadata,
                vfSettings)
.build();
newCommentFragment.setActionCallback(this);
newCommentFragment.setCustomUICallback(this);
FragmentTransaction ft = getSupportFragmentManager().beginTransaction();
ft.replace(R.id.new_comment_container, newCommentFragment);
ft.commit();
val newCommentFragment = VFNewCommentFragmentBuilder(
                newCommentAction,
                getIntent().getStringExtra(IntentKeys.INTENT_CONTAINER_ID),
                articleMetadata,
                vfSettings)
.build();
newCommentFragment.setActionCallback(this)
newCommentFragment.setCustomUICallback(this)
val ft = supportFragmentManager.beginTransaction()
ft.replace(R.id.new_comment_container, newCommentFragment)
ft.commit()
  1. Listen to theNewCommentFragment action callback .
@Override
public void onNewAction(VFActionType actionType, VFActionData action) {
    if (actionType == VFActionType.closeNewCommentPressed) {
        onBackPressed();
    } else if (actionType == VFActionType.authPressed){
    		Intent intent = new Intent(getApplicationContext(), LoginActivity.class);
    		startActivity(intent);
    }
}
override fun onNewAction(actionType: VFActionType, action: VFActionData) {
    if (actionType == VFActionType.closeProfilePressed) {
        onBackPressed()
    } else if (actionType == VFActionType.authPressed){
    		Intent intent = new Intent(getApplicationContext(), LoginActivity.class);
    		startActivity(intent);
    }
}

Open a profile

  1. Create yourVFSettings object.
VFColors colors = new VFColors(ContextCompat.getColor(getApplicationContext(), R.color.colorPrimary), ContextCompat.getColor(getApplicationContext(), R.color.colorPrimaryLight), Color.WHITE);
VFSettings vfSettings = new VFSettings(colors);
val colors = VFColors(
    ContextCompat.getColor(applicationContext, R.color.colorPrimary),
    ContextCompat.getColor(
        applicationContext, R.color.colorPrimaryLight
    ),
    Color.WHITE
)
val vfSettings = VFSettings(colors)
  1. Create theVFProfilePresentationType object.
VFProfilePresentationType presentationType = VFProfilePresentationType.profile;
if (getIntent().getStringExtra(IntentKeys.INTENT_USER_PRESENTATION_TYPE) != null) {
    String presentationTypeString = getIntent().getStringExtra(IntentKeys.INTENT_USER_PRESENTATION_TYPE);
    if (presentationTypeString.equals(VFProfilePresentationType.profile.toString())) {
        presentationType = VFProfilePresentationType.profile;
    } else if (presentationTypeString.equals(VFProfilePresentationType.feed.toString())) {
        presentationType = VFProfilePresentationType.feed;
    }
}
var presentationType = VFProfilePresentationType.profile
if (intent.getStringExtra(IntentKeys.INTENT_USER_PRESENTATION_TYPE) != null) {
    val presentationTypeString =
        intent.getStringExtra(IntentKeys.INTENT_USER_PRESENTATION_TYPE)
    if (presentationTypeString == VFProfilePresentationType.profile.toString()) {
        presentationType = VFProfilePresentationType.profile
    } else if (presentationTypeString == VFProfilePresentationType.feed.toString()) {
        presentationType = VFProfilePresentationType.feed
    }
}
  1. Add theProfileFragment into your content .
VFProfileFragment profileFragment = new VFProfileFragmentBuilder(
                UUID.fromString(getIntent().getStringExtra(IntentKeys.INTENT_USER_UUID)),
                presentationType,
                vfSettings
).build();
profileFragment.setActionCallback(this);
profileFragment.setCustomUICallback(this);
FragmentTransaction ft = getSupportFragmentManager().beginTransaction();
ft.replace(R.id.profile_container, profileFragment);
ft.commit();
val profileFragment = VFProfileFragmentBuilder(
                UUID.fromString(getIntent().getStringExtra(IntentKeys.INTENT_USER_UUID)),
                presentationType,
                vfSettings
).build();
profileFragment.setActionCallback(this)
profileFragment.setCustomUICallback(this)
val ft = supportFragmentManager.beginTransaction()
ft.replace(R.id.profile_container, profileFragment)
ft.commit()
  1. Listen to theProfileFragment action callback .
@Override
public void onNewAction(VFActionType actionType, VFActionData action) {
    if (actionType == VFActionType.closeProfilePressed) {
        onBackPressed();
    } else if (actionType == VFActionType.authPressed){
    		Intent intent = new Intent(getApplicationContext(), LoginActivity.class);
    		startActivity(intent);
    }
}
override fun onNewAction(actionType: VFActionType, action: VFActionData) {
    if (actionType == VFActionType.closeNewCommentPressed) {
        onBackPressed()
    } else if (actionType == VFActionType.authPressed){
    		Intent intent = new Intent(getApplicationContext(), LoginActivity.class);
    		startActivity(intent);
    }
}

Implement the VFLayoutInterface (Optional)

The fragment content height will change depending on the amount of content present on the container. Listen to height changes by implementing the VFLayoutInterface and update the container view height accordingly.

@Override
public void containerHeightUpdated(VFFragment fragment, int height) {

}
fun containerHeightUpdated(fragment: VFFragment, height: Int ) {

}

Fetch the comment count for a container (Optional)

Implement the commentCount call passing the container ID

LiveCommentsService liveCommentsService = ViafouraSDK.liveComments();
liveCommentsService.getCommentCount("12312312", new LiveCommentsService.CommentCountCallback() {
    @Override
    public void onSuccess(Integer commentCount) {

    }

    @Override
    public void onError(NetworkError err) {

    }
});

Updated about 1 month ago

What’s Next