اضافه کردن آیکن و تنظیم رنگ در i3

خب سلام

اول از همه بگم که این آموزش شخصی سازی بار i3status هست ولی من خودم از polybar استفاده می کنم پس احتمالا در آینده راجع به دو تا bar که polybar و i3blocks هستن هم بنویسم

راستی اگه قسمت قبل رو ندیدید میتونید اینجا پیداش کنید

یه مقدمه ای بگم! i3status بار پیشفرض i3 هستش که وقتی i3 رو برای اولین بار نصب و اجرا می کنید همچین ظاهر خشک، مسخره و ترسناکی! داره

که با شخصی سازی هایی که اعمال شد به این جا رسید

خلاصه که دستتون بازه!

مراحلی که این دفعه داریم دو قسمته: اول تنظیم کردن آیکن ها(مثل آیکن تلگرام یا مثلا فایرفاکس که توی بار دوم می بینید) و دوم تنظیم رنگ ها هم برای بار و هم برای i3

۱- تنظیم آیکن ها

من برای تنظیم آیکن ها از فونت awesome استفاده می کنم ولی بدونید که تنها راه نیست هرچند که یکی از بهترین هاست!

اول باید نصبش کنیم(میدونستید؟ انصافا میدونستید؟)

برای آرچ که اینطوری نصب میشه

sudo pacman -S ttf-font-awesome

بعدش بهتره یه ریستارت بکنید ولی نکنید هم هیچ مشکلی پیش نمیاد! شاید فونت ها رو درست تو ترمینال نشون نده تا بوت بعدی که خب مهمه؟

حالا باید بریم cheatsheet اش رو پیدا کنیم! ایناهاش!

خب حالا باید فایل کانفیگ خود i3 رو ویرایش کنیم

vim ~/.config/i3/config

مثلا فرض کنید مثل من میخواید فایر فاکس رو بندازید توی workspace 1 و اسم و لوگوش هم بندازید اونجا اول باید دنبال یه خط توی فایل کانفیگ بگردید که این شکلیه

set $ws1 &quot1&quot

بعد مثلا میخواید آیکن فایرفاکس رو بهش بدید. میرید توی اون cheatsheet بعد روی brands میزنید و بعد دنبال فایرفاکس بگردید آیکنش رو کپی کنید و حالا بیاید تو ترمینالتون اون خط رو به این تغییر بدید(فقط چون انگار ویرگول از فونت های awesome پشتیبانی نمیکنه من به جای آیکنش <icon> نوشتم

set $ws1 &quot1:<icon> firefox

حالا برای بقیه موارد مثل ترمینال و تلگرام و غیره هم خطوط workspace هایی که میخواید بهشون اختصاص بدید رو ویرایش کنید در نهایت قسمت workspace های من این شکلی شد (اینجا خود چیز های اصلی فونت awesome رو گذاشتم که اگه خواستید کپی کنید و درسته که درست نمایش داده نمیشه ولی روی سیستم شما اگر فونت رو نصب داشته باشید همه چی خوبه!

set $ws1 &quot1:  Browser&quot  
set $ws2 &quot2:  Terminal&quot  
set $ws3 &quot3:  Telegram&quot  
set $ws4 &quot4:  Clementine&quot

خب انگار دیگه با آیکن ها کاری نداریم! بریم سراغ رنگ ها.

۲- تنظیم رنگ ها در i3
خب من خودم برای رنگ ها میام یه سری متغیر تعریف می کنم و بعد اون متغیر ها رو قرار میدم چون مثلا شاید بخوام رنگ بار با رنگ حاشیه یکی باشه و دفعه بعد که میخوام تغییرش بدم همین طور نباید دوره بیفتم و رنگ ها رو تغییر بدم.

به طور کل یه متغیر این طوری تعریف میشه در فایل کانفیگ i3

set $VARIABLE_NAME VALUE

مثلا برای متغیر background که من تعریف کردم این خط رو گذاشتم

set $background #010012cc

گذاشتم در کل من این ها رو به فایل کانفیگ i3 اضافه کردم(که از تم materia dark teal اگه اسمش درست یادم باشه عموما رنگ هاش رو در آوردم)

# Window Colors 
set     $bgcolor        #00897b 
set     $ibgcolor       #363636 
set     $textcolor      #ffffff 
set     $ubgcolor       #ff0000 
set     $dbgcolor       #00564d

خب حالا ما یه مشت متغیر داریم که باید بریزیم تو رنگ ها فکر کنم اگه کانفیگ خودم رو بزارم واضح باشه که چجوری باید چیکار کنیم

# class                 border          background      text            indicator 
client.focused          $dbgcolor       $bgcolor        $textcolor      $bgcolor         
client.focused_inactive $ibgcolor       $ibgcolor       $textcolor      $ibgcolor        
client.unfocused        $ibgcolor       $ibgcolor       $textcolor      $ibgcolor        
client.urgent           $dbgcolor       $bgcolor        $textcolor      $ubgcolor

خب این برای تنظیم رنگ در پنجره ها و .... فقط یه نکته اینکه من خودم این تنظیمات رو قبل از قسمت تنظیم بار و بعد از resize کردن گذاشتم

بریم سراغ بار اول یه چندتا متغیر( این تنظیمات بار که الان میگم در قسمت بار i3 و بعد از دستور i3status میان)

قسمت بار بدون هیچ کانفیگی این تنظیمات رو به طور پیشفرض داره

bar{
        status_command i3status
}

درست بعد از دستور بار و قبل از اینکه قسمت بار تموم بشه باید این کار رو بکنیم

bar{
       status_command i3status
    color{
    
    }
}

بعد توی قسمت color تنظیمات رو وارد می کنیم

اول که یه سری متغیر دیگه

set $background #010012cc 
set $statusline #ffffff 
set $ibgcolorbar #dafdff

و بعدش هم تنظیم اونا

background $background 
statusline $statusline 
separator $statusline 
focused_workspace  #00564d $dbgcolor $statusline 
inactive_workspace #333333 $ibgcolorbar #000000 
urgent_workspace   #2f343a #900000 #ffffff

توجه داشته باشید که رنگ ها بر اساس کد هگزشون هستن و شما میتونید توی تقریبا هر نرم افزاری رنگی که میخواید رو انتخاب کنید و از اون کد hex دریافت کنید مثل gimp یا اگه چیزی نمیخواید نصب کنید kleki که آنلاینه

فقط اینکه اگه میخواید شفافیت و transparency اضافه بشه باید اون هگز هایی که میخواید بزارید رو یخورده تغییر بدید یعنی دوتا کاراکتر دیگه برای شفافیت اضافه بشه که اینجا میتونید لیستش رو ببینید مثلا برای متغیر bgcolor که اول تنظیم کردیم مقداری که من گذاشتم به این تغییر کرد

set     $bgcolor        #00897bcc

و به دستور بار هم این خط رو اضافه کنید

i3bar_command i3bar --transparency

اگر هم نمیخواید که مثلا آیکن پرسپولیس اون زیر نمایش داده بشه این خط رو هم اضافه کنید

tray_output none

و این که اگه میخواید بار بتونه با دکمه mod تون نمایش داده بشه و یا پنهان بشه(تغییر وضعیت بده) این خط رو قبل از قسمت بار اضافه کنید

bindsym $mod+b bar mode toggle                                      

در نهایت فعلا تنظیمات بار من این شکلی شد

bindsym $mod+b bar mode toggle                                       
bar {                                                                  
        status_command i3status  
        mode hide                                                       
        i3bar_command i3bar --transparency                            
        tray_output none                                             
        colors {                                                      
                set $background #010012cc  
                set $statusline #ffffff  
                set $ibgcolorbar #dafdff  
                background $background                                
                statusline $statusline                                
                separator $statusline                       
                focused_workspace  #00564d $dbgcolor $statusline  
                inactive_workspace #333333 $ibgcolorbar #000000  
                urgent_workspace   #2f343a #900000 #ffffff  
        }                                                              
}

در ادامه احتمالا به تنظیم i3status بعد i3block و بعد polybar بپردازم(شاید هم i3gaps رو هم گفتم کسی چه میدونه!) میخواستم تنظیم i3status رو هم اینجا بگم که انگار خیلی شد

فقط یه چیزی من قسمت قبل یادم رفت من خودم تنظیم i3 رو شروعش رو از اینجا یاد گرفتم پس منطقیه که حرف هایی که میزنم خیلی شبیه باشه بهش