tencent cloud

Feedback

Last updated: 2024-03-20 17:30:18
    Chat for Unity on iOS or Android. This Chat Unity UIKit & UIKit Demo is a game scene UI component library based on Tencent Cloud IM Chat SDK. It currently includes Conversation and Chat components with sending and receiving text messages, sending and receiving emoji messages, Custom emoticons and other functions. Introducing this UIKit in your Unity project can help you quickly build your chat system.
    Chat Demo

    Environmental requirements

    Platform
    version
    Unity
    2019.4.15f1 and above
    Android
    Android Studio 3.5 and above, App requires Android 4.1 and above
    iOS
    Xcode 11.0 and above,Please ensure that your project has a valid developer signature certificate.

    Perquisites

    Signed up for a Tencent Cloud account and completed identity verification.
    1. Log in to the Chat console.
    Note:
    The same Tencent Cloud account can create up to 300 instant messaging IM applications. If there are already 300 applications, you can deactivate and delete the unused applications before creating new ones . After the application is deleted, all data and services corresponding to the SDKAppID cannot be recovered, please operate with caution.
    2. Created a chat application as instructed in Creating and Upgrading an Application and recorded the SDKAppID.
    
    3. Record the SDKAppID. You can view the status, business version, SDKAppID, label, creation time, and expiration time of the newly created application on the console overview page.
    
    
    4. Click the created application, click Auxiliary Tools>UserSig Generation & Verification in the left navigation bar, create a UserID and its corresponding UserSig, copy the signature information, and use it for subsequent logins.
    
    
    

    How to import UIKit into the project

    import AssetPackage

    1. Create/start an existing Unity project.
    2. Add dependencies in the Packages/manifest.json file:
    {
    "dependencies": {
    "com.tencent.imsdk.unity": "https://github.com/TencentCloud/chat-sdk-unity.git#unity"
    }
    }
    3. Download the chat-uikit-unity.unitypackage under the UIKit github directory, and import the resource package.

    Initialize and log in

    There are two ways to initialize and log in to IM:
    
    Outside the component: the entire application just needs to initialized and logged in once. You need to add the corresponding event callbacks yourself. Inside the component(Recommanded): pass parameters into the component through configuration. UIKit has bound corresponding event callbacks for you, including events for receiving new messages and events for updating the session list.
    
    Method 1: Outside the component
    Initialize IM in the Unity project you created, note that the IM application only needs to be initialized once. This step can be skipped if integrating in an existing IM project.
    public static void Init() {
    int sdkappid = 0;
    SdkConfig sdkConfig = new SdkConfig();
    
    sdkConfig.sdk_config_config_file_path = Application.persistentDataPath + "/TIM-Config";
    
    sdkConfig.sdk_config_log_file_path = Application.persistentDataPath + "/TIM-Log"; // Set local log address
    
    TIMResult res = TencentIMSDK.Init(long.Parse(sdkappid), sdkConfig);
    }
    
    public static void Login() {
    if (userid == "" || user_sig == "")
    {
    return;
    }
    TIMResult res = TencentIMSDK.Login(userid, user_sig, (int code, string desc, string json_param, string user_data)=>{
    // callback after login
    });
    }
    
    Method 2: inside the component
    You can also pass SDKAppID, UserSig, and UserID into the component through configuration to initialize and log in IM. (same as demo)
    It is only recommanded if you are trying to run demo. Using this method directly in your
    using com.tencent.imsdk.unity.uikit;
    // The demo login logic is as follows
    public static void Init() {
    Core.SetConfig(sdkappid, userId, sdkUserSig);
    Core.Init();
    Core.Login();
    }
    // If you run the unity demo directly, it is recommended to log in through the mobile phone number/verification code input box on the Main page. It can ensure the normal operation of callbacks and so on.
    // Since Unity on the computer does not support mobile phone number login, please enter userid into the mobile phone number input box and userSig into the verification code input box.
    // Assets/Example/Scripts/Main.cs
    private void Login()
    {
    // Comment out the previous Login function content and add the following content
    loginButton.interactable = false;
    Core.SetConfig(Config.sdkappid, phoneNumber.text, captcha.text);
    Core.Init();
    Core.Login(HandleAfterLogin);
    loginButton.interactable = true;
    }
    

    Use Conversation and Chat prefabs

    You can put the following prefabs into your scene and modify the corresponding styles and layouts.
    
    
    

    Structure

    Assets/Example This directory corresponds to the content displayed when the actual project is running, including two pages of Scenes, the corresponding codes are Main.cs (login interface) and Chat.cs (chat interface).
    Chat contains c2c chat and group chat content, you can get the conversation (friends) list and send text and emoticon messages. The content in Chat is composed of components in Prefabs, you can modify the display content and style by modifying Prefabs.
    
    Assets/Prefabs The following components can be used in combination (refer to the Chat page of Scenes), or the components can be modified and used separately according to requirements.
    
    ChatPanel message history list
    Message display area ConvMessagePanel
    ConversationNamePanel ConversationNamePanel
    Historical message display area MessageContentPanel
    message input area ActionPanel
    Emoticons area OverlayPanel
    Close chat window button CloseButton
    
    
    
    
    ConversationPanel conversation list. Now it mainly displays the single-chat sessions of friends. The corresponding code is in Script/Components/Conversation.cs. Styles for each conversation are in ConversationItem.prefabs.
    conversation list area FriendPanel
    Search area SearchPanel
    Conversation list ConversationListPanel
    
    
    
    
    ChannelPanel The channel list consists of 4 channel buttons, namely World, Channel, Team, Friends. The first three channels are group chat channels, and the friend channel is a c2c channel and will display a list of c2c conversations. Click events and styles for channel buttons are in Script/Components/Chat.cs.
    AvatarPanel The avatar style in a conversation (ConversationItem), a single chat record (messageItem, etc.). Contains avatars and segment avatars.
    ConversationItem The session style of the conversation list, including the avatar (AvatarPanel), conversation name and rank.
    MessageItem, MessageItemSelf Text message content. Text message from others and from self is seperated.
    Avatar area MessageSenderPanel
    Message area MessageContentPanel
    Sender information area SenderNamePanel
    sender name MessageSender
    Sender rank Icon and name Icon and Text
    message body Panel
    StickerMessageItem,StickerMessageSelf The content of the emoji message. The content is the same as MessageItem
    GroupTipItem Group reminder message content, for users to enter the group, withdraw from the group, admin messages, etc. Contains group name and message body.
    TimeStamp Time nodes in historical messages.
    StickerItem, MenuItem They are emoticons and emoticons in the shortcut menu respectively.
    

    How to start the demo project

    Initialize login

    Pass the SDKAppID, UserSig, and UserID into the component through configuration to initialize and log in the IM. Note: the entire project only needs to be initialized once
    using com.tencent.imsdk.unity.uikit;
    // The demo login logic is as follows
    public static void Init() {
    Core.SetConfig(sdkappid, userId, sdkUserSig);
    Core.Init();
    Core.Login();
    // you can pass function
    // Core.Login(HandleAfterLogin);
    }
    // If you run the unity demo directly, it is recommended to log in through the mobile phone number/verification code input box on the Main page. It can ensure the normal operation of callbacks and so on.
    // Since Unity on the computer does not support mobile phone number login, please enter userid into the mobile phone number input box and userSig into the verification code input box.
    // Assets/Example/Scripts/Main.cs
    private void Login()
    {
    // Comment out the previous Login function content and add the following content
    loginButton.interactable = false;
    Core.SetConfig(Config.sdkappid, phoneNumber.text, captcha.text);
    Core.Init();
    Core.Login(HandleAfterLogin);
    loginButton.interactable = true;
    }
    
    Open the Chat page directly after initial login.
    

    Channel

    The demo is divided into four channels: World, Channel, Team, and Friends. Among them, the Friends channel displays a list of C2C sessions and added friends, click on a session to start chatting. The other three channels are group conversations. If you need to send messages in this channel, you need to create a group first and add its ID to the project.
    

    Create groups

    Added via RestAPI You can create a group through create_group in the background RestAPI. See Link for details. add in console You can also create groups through the console. Go to your IM application in the console -> Group Management -> Add Group.
    

    Add group to channel

    Enter Assets/Example/Scripts/Config/Config.cs, fill in the group ID of the created group into communityID (community), channelID (channel), groupID (team). And call joinGroup after login to enter the corresponding group after login and send messages in the group.
    

    Send a message

    If you have added a group to the channel, you can send group chat messages through the World, Channel, and team channel. You can also click on a c2c conversation in the friend channel to send a c2c chat message.
    

    Modify emoticons and Rank information

    Rank

    In this demo, each user's rank is randomly generated, if you need to use rank information, you can set it in the user's custom field.
    UserProfileCustemStringInfo teer = new UserProfileCustemStringInfo{
    user_profile_custom_string_info_key:"rank",
    user_profile_custom_string_info_value:"teer"
    }
    List<UserProfileCustemStringInfo> customArray = new List<UserProfileCustemStringInfo>();
    customArray.Add(teer);
    TencentIMSDK.ProfileModifySelfUserProfile(new UserProfileItem{
    user_profile_item_custom_string_array:customArray;
    });
    And display the corresponding rank icon according to the rank name.
    1. Load the icon or avatar frame corresponding to the rank into Resources. (If you use Url to get it, you can ignore this step)
    2. Modify the display of the avatar frame and icon in the code. The parts that need to be modified are the conversation list and the message list
    2.1 Session list
    2.1.1 Supplement the acquired rank information in the session acquisition function completeConvList. The final friend session information displayed is in the friendProfiles list.
    2.1.2 Modify the rendered icons and avatars in GenerateList (conversation list rendering) in Conversation.cs
    2.2 Message list
    2.2.1 Obtain the segment information in the message sender's information in RenderMessageForScroll of Chat.cs (if you need to modify other display content, you can also get it from here)
    2.2.2 Modify the displayed style and other details in MsgItem.cs
    

    Emojis

    Emojis are displayed in OverlayPanel in Chat.cs using StickerPanel. You can import your own emoji to use. (You need to import your own emojis in advance)
    1. Import the emojis used in the Assets/Resources folder
    
    
    
    2. Change the Texture Type of the image to Sprite (2D and UI), and modify the Pixels Per Unit according to the size of the image.
    
    
    
    3. Define the corresponding emoji package data
    // Generate a list of emojis, StickerPackage is a set of emojis
    List<StickerPackage> stickers = new List<StickerPackage> {
    new StickerPackage {
    name = "4350",
    baseUrl = "custom_sticker_resource/4350",
    menuItem = new StickerItem {
    name = "menu@2x",
    index = 0,
    },
    stickerList = new List<StickerItem> {
    new StickerItem { // emoji package data
    name = "menu@2x",
    index = 0
    },
    }
    }
    };
    4. Album emoticons for UIKit
    using com.tencent.imsdk.unity.uikit;
    
    Core.SetStickerPackageList(Config.stickers);
    

    Language Package

    IM Unity UIKit Demo provides a language switching system based on the system language, and supports Simplified Chinese and English. You can add languages or modify the configuration inside according to your needs.
    
    1. Language files Language data is placed in Resources/LanguageTxt. Now contains Chinese.txt(Simplified Chinese) and English.txt(English) for simplified Chinese and English. If you need other languages, you can add the corresponding txt file. The structure of the file is as follows:
    //English.txt
    Key: Value
    
    //Chinese.txt
    Key: value
    Key should be consistent with the Key of other languages, and consistent with subsequent enum Value is the value of the language corresponding to Key Use a colon to separate Key and Value
    2. Set language
    3. Set language and entry If you have added a language, add the corresponding language vocabulary txt file and add a new language in Language in LanguageDataManager.cs, and add the corresponding Key in LanguageTextName.
    4. Load the language files
    private Dictionary<string,string> EnglishDictionary = new Dictionary<string,string>();
    LoadLanguageTxt(Language. English);
    5. Component settings (static modification) Add the LanguageUIText(Script) component to the text component that needs to be set, and select the Key of the word to be displayed. The displayed Key corresponds to the enum in LanguageTextName and the Key in the vocabulary file.
    
    
    6. Set language To set the language, call SetCurrentLanguageValue when the software starts. If you want to fix the language, you can directly assign a value to currentLanguage in LanguageDataManager.cs (it can be used as the default language). The Demo judges and assigns values according to the system language. If the components that need to be modified are not only static components, the simple method is to save the currently used language to config (saved to Core in Demo) and judge and display it in the code.
    

    API documents

    

    SetConfig

    Pass Config information before Init, including sdkappid, userid and usersig.
    
    using com.tencent.imsdk.unity.uikit;
    
    Core.SetConfig(sdkappid, userid, usersig);
    

    Init

    Use the Init method provided by UIKit to initialize the SDK, and the AddRecvNewMsgCallback and SetConvEventCallback callbacks will be automatically bound.
    
    using com.tencent.imsdk.unity.uikit;
    
    Core.Init();
    

    SetStickerPackageList

    Set sticker package list through SetStickerPackageList.
    
    using com.tencent.imsdk.unity.uikit;
    
    Core.SetStickerPackageList(Config.stickers);
    

    Login

    Log in to the account through Login, and execute the bound callback function after the login is completed.
    
    using com.tencent.imsdk.unity.uikit;
    
    Core.Login((params string[] args) => {
    });
    

    SetMessageList

    Add the message list of a session, merge it into the current session message dictionary after processing, and trigger the OnMsgListChanged event.
    
    using com.tencent.imsdk.unity.uikit;
    
    Core.SetMessageList(currentConvID, newMsgList, isFinished);
    

    SetCurrentConv

    Set the currently selected session and fire the OnCurrentConvChanged event.
    
    using com.tencent.imsdk.unity.uikit;
    
    Core.SetMessageList(convID, convType);
    

    SetCurrentStickerIndex

    Set the currently selected sticker group and trigger OnCurrentStickerIndexChanged event.
    
    using com.tencent.imsdk.unity.uikit;
    
    Core.SetMessageList(stickerIndex);
    

    Logout

    Log out and clear data.
    
    using com.tencent.imsdk.unity.uikit;
    
    Core.Logout((string[] parameters) => {
    // Logout callback
    });
    

    TencentChatSDK

    Unity TencentIMSDK Provides comprehensive instant communication capabilities based on the Unity platform. You can use TencentChatSDK to get other chatting related functions. For example, get user information through TencentChatSDK.
    
    using com.tencent.imsdk.unity;
    
    FriendShipGetProfileListParam param = new FriendShipGetProfileListParam
    {
    friendship_getprofilelist_param_identifier_array = new List<string>
    {
    "self_userid"
    }
    };
    
    TIMResult res = TencentIMSDK.ProfileGetUserProfileList(param, (int code, string desc, List<UserProfile> profile, string user_data)=>{
    });
    

    Communication and Feedback

    If you have any questions during access and use, you can enter the Unity platform of Tencent Cloud Instant Messaging IM ZhiLiao.
    Contact Us

    Contact our sales team or business advisors to help your business.

    Technical Support

    Open a ticket if you're looking for further assistance. Our Ticket is 7x24 avaliable.

    7x24 Phone Support