In this tutorial, we’ll be demonstrating how to use the ui in main browser and log object commands, as well as the ui html snippet command to customize the appearance of your bot.
First, let’s start by using the ui in main browser command. Drag this command into your script and click “ok”. Now, we can add a log view to our main browser by dragging in a ui log view and clicking “ok”.
Next, let’s use the log object command to display information in a more organized and easy-to-read manner. Imagine that we have an object called #txinfo that we want to display in our log view. To do this, we can set #txinfo as a variable in yaml format, and then use the log object command to display it in our log view.
Finally, let’s use the ui html snippet command to customize the appearance of our bot. By adding a style tag, we can change the background color and text color to our liking.
These new features of UBot Studio make it easier to display information and customize the appearance of your bot.
Here’s the code! You can copy and paste it directly into the script window.
ui in main browser {
ui html snippet("<style>
body \{
background-color: #060606;
\}
.log-view \{
background-color: #282c34!important;
color: white;
\}
</style>
<link rel=\"stylesheet\" href=\"https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/styles/a11y-dark.min.css\" integrity=\"sha512-Vj6gPCk8EZlqnoveEyuGyYaWZ1+jyjMPg8g4shwyyNlRQl6d3L9At02ZHQr5K6s5duZl/+YKMnM3/8pDhoUphg==\" crossorigin=\"anonymous\" referrerpolicy=\"no-referrer\" />")
ui log view("Log")
}
set(#txinfo,"gasBalance: \"0.131078355\"
coinsNames:
in: Cake
out: USDC
balances:
in: \"0.00167\"
out: \"5.57607\"
amount: \"0.00167\"
amountIn: \"0.00167\"
minAmountOut: \"0.00749\"
method: swapExactTokensForTokens
gasFee: \"0.000281308\"
hash: \"0x1c715fecaxx715fexx756474567715fe015657459e836e74715fe\"
status: successful
endingBalances:
A: \"0.00\"
B: \"5.58\"","Local")
log object(#txinfo)