How to use the gui.Font function in gui

To help you get started, we’ve selected a few gui examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github yue / wey / lib / view / chat-box.js View on Github external
this.view.addChildView(this.browser)

    this.replyBox = gui.Container.create()
    this.replyBox.setBackgroundColor(theme.chatBox.borderColor)
    this.replyBox.setStyle({padding: 5})
    this.view.addChildView(this.replyBox)

    this.replyEntry = gui.TextEdit.create()
    this.replyEntry.setEnabled(false)
    if (process.platform !== 'win32') {
      // Force using overlay scrollbar.
      this.replyEntry.setOverlayScrollbar(true)
      this.replyEntry.setScrollbarPolicy('never', 'automatic')
    }
    // Font size should be the same with messages.
    const font = gui.Font.create(gui.Font.default().getName(), 15, 'normal', 'normal')
    this.replyEntry.setFont(font)
    // Calculate height for 1 and 5 lines.
    this.replyEntry.setText('1')
    this.minReplyEntryHeight = this.replyEntry.getTextBounds().height
    this.replyEntry.setText('1\n2\n3\n4\n5')
    this.maxReplyEntryHeight = this.replyEntry.getTextBounds().height
    this.replyEntry.setText('')
    this.replyEntry.setStyle({height: this.minReplyEntryHeight})
    // Handle input events.
    this.replyEntry.onTextChange = this._adjustEntryHeight.bind(this)
    this.replyEntry.shouldInsertNewLine = this._handleEnter.bind(this)
    this.replyBox.addChildView(this.replyEntry)

    // Loading indicator.
    this.loadingIndicator = gui.GifPlayer.create()
    this.loadingIndicator.setStyle({width: 40, height: 40})
github oyyd / react-yue / src / apply_styles.js View on Github external
function applyTextStyles (view, styles) {
  let { fontWeight, fontFamily, fontSize, fontStyle } = styles
  fontWeight = fontWeight || ''
  fontWeight = FONT_WEIGHTS[fontWeight.toString()] || fontWeight

  let defaultSystemFont = gui.Font.default()
  let fontParams = [
    fontFamily || defaultSystemFont.getName(),
    fontSize || defaultSystemFont.getSize(),
    fontWeight || defaultSystemFont.getWeight(),
    fontStyle || defaultSystemFont.getStyle(),
  ]
  view.setFont(gui.Font.create(...fontParams))
  // fixes bug where gui.Label height doesn't grow with
  // the font size
  view.setStyle({ height: fontParams[1] })

  if (styles.textAlign) {
    view.setAlign(ALIGN_MAPPING[styles.textAlign])
  }

  if (styles.verticalAlign) {
    view.setVAlign(VALIGN_MAPPING[styles.verticalAlign])
  }
}
github oyyd / react-yue / src / apply_styles.js View on Github external
function applyTextStyles (view, styles) {
  let { fontWeight, fontFamily, fontSize, fontStyle } = styles
  fontWeight = fontWeight || ''
  fontWeight = FONT_WEIGHTS[fontWeight.toString()] || fontWeight

  let defaultSystemFont = gui.Font.default()
  let fontParams = [
    fontFamily || defaultSystemFont.getName(),
    fontSize || defaultSystemFont.getSize(),
    fontWeight || defaultSystemFont.getWeight(),
    fontStyle || defaultSystemFont.getStyle(),
  ]
  view.setFont(gui.Font.create(...fontParams))
  // fixes bug where gui.Label height doesn't grow with
  // the font size
  view.setStyle({ height: fontParams[1] })

  if (styles.textAlign) {
    view.setAlign(ALIGN_MAPPING[styles.textAlign])
  }

  if (styles.verticalAlign) {
github yue / wey / lib / view / account-header.js View on Github external
constructor(account) {
    this.account = null

    this.font = gui.Font.default().derive(8, 'semi-bold', 'normal')
    this.hover = false

    // Toggle the menu when clicking on the panel.
    this.canShowMenu = false

    this.menu = gui.Menu.create([
      { label: 'Logout', onClick: this.logout.bind(this) },
    ])

    this.view = gui.Container.create()
    this.view.setStyle({width: '100%', height: 45})
    this.view.onDraw = this.draw.bind(this)
    this.view.onMouseEnter = () => {
      this.hover = true
      this.canShowMenu = true
      this.view.schedulePaint()
github oyyd / react-yue / src / components / __tests__ / base.spec.js View on Github external
createTestSuite(render => {
      const visible = false
      const enabled = false
      const focusable = true
      const mouseDownCanMoveWindow = true
      const font = gui.Font.create('aria', 14, 'thin', 'normal')
      const color = '#FFFFFF'
      const backgroundColor = '#000000'

      const ele = (
        
      )
github yue / wey / lib / view / account-button.js View on Github external
constructor(mainWindow, account) {
    this.account = account
    this.active = false
    this.subscription = {
      onUpdateInfo: account.onUpdateInfo.add(this.updateInfo.bind(this)),
      onUpdateChannels: account.onUpdateChannels.add(this.updateChannels.bind(this)),
      onUpdateReadState: account.onUpdateReadState.add(this.update.bind(this)),
    }

    this.image = null
    this.textAttributes = {
      font: gui.Font.create('Helvetica', 35, 'normal', 'normal'),
      color: '#FFF',
      align: 'center',
      valign: 'center',
    }
    this.view = gui.Container.create()
    this.view.setMouseDownCanMoveWindow(false)
    this.view.setStyle({
      marginTop: 14,
      width: 68,
      height: 40,
    })
    this.view.onMouseUp = () => mainWindow.selectAccount(account)
    this.view.onDraw = this.draw.bind(this)

    this.updateInfo()
  }
github yue / wey / lib / theme / dark / index.js View on Github external
const gui = require('gui')

const darkTheme = {
  channelHeader: {
    height: 45,
    padding: 10,
    font: gui.Font.default().derive(4, 'bold', 'normal'),
    fontColor: '#2C2D30',
    borderColor: '#E5E5E5',
    backgroundColor: '#FFF',
  },
  channelItem: {
    height: gui.Font.default().getSize() + 12,
    padding: 10,
    unreadFont: gui.Font.default().derive(0, 'bold', 'normal'),
    normalColor: '#C1C2C6',
    selectedColor: '#FFF',
    disabledColor: '#8B8D94',
    hoverBackground: '#2B2E3B',
    selectedBackground: '#6798A2',
    mentionsWidth: 8,
    mentionsColor: '#FFF',
    mentionsBackground: '#DC5960',
github yue / wey / lib / view / channels-searcher.js View on Github external
const gui = require('gui')

const ITEM_HEIGHT = 50
const SEPARATOR_COLOR = '#E8E8E8'
const FOCUS_BACKGROUND = '#ECF5FB'
const PADDING = 5

const NAME_FONT = gui.Font.default().derive(0, 'bold', 'normal')
const DESP_FONT = gui.Font.default().derive(2, 'normal', 'normal')

class ChannelsSearcher {
  constructor(mainWindow) {
    this.mainWindow = mainWindow
    this.channels = []

    this.view = gui.Container.create()
    this.view.setMouseDownCanMoveWindow(false)
    this.view.setBackgroundColor('#FFF')
    this.view.setStyle({flex: 1, padding: 20})

    this.entry = gui.Entry.create()
    this.entry.setStyle({width: '100%', marginBottom: 20})
    this.entry.onTextChange = this.onTextChange.bind(this)
    this.view.addChildView(this.entry)
github yue / wey / lib / view / channels-searcher.js View on Github external
const gui = require('gui')

const ITEM_HEIGHT = 50
const SEPARATOR_COLOR = '#E8E8E8'
const FOCUS_BACKGROUND = '#ECF5FB'
const PADDING = 5

const NAME_FONT = gui.Font.default().derive(0, 'bold', 'normal')
const DESP_FONT = gui.Font.default().derive(2, 'normal', 'normal')

class ChannelsSearcher {
  constructor(mainWindow) {
    this.mainWindow = mainWindow
    this.channels = []

    this.view = gui.Container.create()
    this.view.setMouseDownCanMoveWindow(false)
    this.view.setBackgroundColor('#FFF')
    this.view.setStyle({flex: 1, padding: 20})

    this.entry = gui.Entry.create()
    this.entry.setStyle({width: '100%', marginBottom: 20})
    this.entry.onTextChange = this.onTextChange.bind(this)
    this.view.addChildView(this.entry)