UPDATE
Fixed by calculating the needed position using the max content.x position and a 0.0-1.0 factor
Component.onCompleted:
{
var maxContentX = content.width - frame.width
var factor = 1.0 // 0, 0.5, 1.0
var newPosition = (maxContentX*factor)/content.width
hbar.position = newPosition
}
Qt-Docs: ScrollBar QML Type
Position Property
This property holds the position of the scroll bar, scaled to 0.0 -
1.0.
but the position never reaches 1.0 - because the position only holds 1 minus bar size
i don't understand whats the sense is of scaling the position between 0 and 1 but then make it directly related to bar size
are there any meaningful usages for position values above (1 minus bar-size)?
is there a way to get the bar size?
any idea how to calculate the correct mid/max values for the position?
i want to build a timer that toggles between 0%, 50% and 100% position
Qt-Sample: Non-attached Scroll Bars
import QtQuick 2.15
import QtQuick.Controls 2.15
Item
{
height: 300
width: 300
Column
{
Text { text: "vbar.position: "+vbar.position }
Text { text: "hbar.position: "+hbar.position }
}
Rectangle {
id: frame
clip: true
width: 160
height: 160
border.color: "black"
anchors.centerIn: parent
Text {
id: content
text: "ABC"
font.pixelSize: 160
x: -hbar.position * width
y: -vbar.position * height
}
ScrollBar {
id: vbar
hoverEnabled: true
active: hovered || pressed
orientation: Qt.Vertical
size: frame.height / content.height
anchors.top: parent.top
anchors.right: parent.right
anchors.bottom: parent.bottom
}
ScrollBar {
id: hbar
hoverEnabled: true
active: hovered || pressed
orientation: Qt.Horizontal
size: frame.width / content.width
anchors.left: parent.left
anchors.right: parent.right
anchors.bottom: parent.bottom
}
}
}
I don't think I can answer the "why" part of your question. But to get the bar size, I believe you can use the Scrollbar's contentItem property. To get 0%, 50%, and 100%, you could probably do something like this (for a horizontal scrollbar):
// 0%
position: 0
// 50%
position: (width - contentItem.width) / width / 2
// 100%
position: (width - contentItem.width) / width
I need that Less compiler don't convert to HEX colors defined in rgba(), even if alpha channel is 1
Actually, the following Less code:
#color1: rgba(0,0,0,1);
#color2: rgba(0,0,0,0.1);
#color1_light: lighten(#color1,90%);
#color2_light: lighten(#color2,90%);
.a {
background:#color1;
color: #color1_light;
}
.b {
background:#color2;
color: #color2_light;
}
is processed to:
.a {
background: #000000;
color: #e6e6e6;
}
.b {
background: rgba(0, 0, 0, 0.1);
color: rgba(230, 230, 230, 0.1);
}
but I need to have (for many reasons related to further evaluations)
.a {
background: rgba(0, 0, 0, 1);
color: rgba(230, 230, 230, 1);
}
.b {
background: rgba(0, 0, 0, 0.1);
color: rgba(230, 230, 230, 0.1);
}
How to solve this?
Basically this is pretty easy, all you have to do is to escape your expression, below you will find two examples how to force less compiler to display rgba format even though alpha is 1:
#color1: rgba(0,0,0,1);
body {
color: ~"rgba("red(#color1), green(#color1), blue(#color1),~" 1)";
background: %(~"rgba(%s, %s, %s, 1)", red(#color1), green(#color1), blue(#color1));
}
Both examples will produce rgba(0, 0, 0, 1), it's up to you which one do you prefer. I bet you will find more info in the docs under string escape and string replace
//EDIT
yup, this is tricky, but still, you can extend this with a mixin so it won't look that bad in code hereafter.
#color1: rgba(0,0,0,1);
.rgba(#color) {
//#rgba: ~"rgba("red(#color), green(#color), blue(#color),~" 1)";
#rgba: %(~"rgba(%s, %s, %s, %s)", red(#color), green(#color), blue(#color), alpha(#color));
}
.torgba(#property, #color) {
#{property}: %(~"rgba(%s, %s, %s, %s)", red(#color1), green(#color1), blue(#color1), alpha(#color1));
}
body {
.rgba(#color1); // mixin returns #rgba variable that may be used later on, it's not color object however, but a string
color: #rgba;
background: #rgba;
.torgba(border-color, #color1); // do the same, but returns property with color in given format
}
How can I change the font size if the name is more than 15 or 20 characters in vueJS?
Here's my code
<p class="name" v-if="roleProfile"><b>{{ roleProfile.company_name }}</b></p>
Create a computed property to add a class to the <p> tag based on the length of roleProfile.company_name:
computed: {
profileClass() {
let profileClass = "name";
if (this.roleProfile.company_name.length > 15) {
profileClass += " smallFont";
}
return profileClass;
}
}
Then in your template:
<p :class="profileClass" v-if="roleProfile">
<b>{{ roleProfile.company_name }}</b>
</p>
I've made a function and assigned it to my div with :style="{ fontSize: heroFontSize }"
Basically I used the reverse ratio, I have defined the minimum and maximum character sizes, and compared to the maximum and minimum number of characters. I have come to the conclusion thet for every 2.5 characters I have to decrease the size by 1px. So below you find the result.
heroFontSize() {
//we map the font sizes between 60chars and 200 chars from 100px to 50px
// there's a reverse ratio between character count and the font size
var minSize = 60;
var textLength = this.question.length;
//for every 2.5 characters we decrease the size with 1px
var multiplier = 2.5;
return 100 - (textLength - minSize) / multiplier + "px";
},
I have looked at the LRCN example (http://tutorial.caffe.berkeleyvision.org/caffe-cvpr15-sequences.pdf) which use LSTM for classification. For video classification a majority voting is done. Why is that? I would assume one waits until the end of a sequence?
In my toy, example binary counting, I inputted the labels in two different ways.
First I labelled every timestep with the sequence label. Secondly I labelled every timestep with an ignore_label but the last one. For simplicity I used a sequence length of 50 and a batchsize of 50 as well.
Both approaches lead to a network, where when I deploy it, I receive the same output for every timestep.
Edit:
The toy example works, if instead of classifying a whole sequence, one predicts the next number. Thus for each number a label exists. This is no solution for a real-world sequence classification task. Using the post by Kaparthy (http://karpathy.github.io/2015/05/21/rnn-effectiveness/) I have created following network:
name: "BasicLstm"
layer {
name: "data"
type: "HDF5Data"
top: "data"
top: "cont"
top: "label"
include {
phase: TRAIN
}
hdf5_data_param {
source: "./path_to_txt.txt"
batch_size: 2000
}
}
layer {
name: "lstm1"
type: "LSTM"
bottom: "data"
bottom: "cont"
top: "lstm1"
recurrent_param {
num_output: 5
weight_filler {
type: "uniform"
min: -0.08
max: 0.08
}
bias_filler {
type: "constant"
value: 0
}
}
}
layer {
name: "lstm2"
type: "LSTM"
bottom: "lstm1"
bottom: "cont"
top: "lstm2"
recurrent_param {
num_output: 4
weight_filler {
type: "uniform"
min: -0.08
max: 0.08
}
bias_filler {
type: "constant"
value: 0
}
}
}
layer {
name: "predict"
type: "InnerProduct"
bottom: "lstm2"
top: "predict"
param {
lr_mult: 1
decay_mult: 1
}
param {
lr_mult: 2
decay_mult: 0
}
inner_product_param {
num_output: 39
weight_filler {
type: "gaussian"
std: 0.01
}
bias_filler {
type: "constant"
value: 0
}
axis: 2
}
}
layer {
name: "softmax_loss"
type: "SoftmaxWithLoss"
bottom: "predict"
bottom: "label"
top: "loss"
loss_weight: 20
softmax_param {
axis: 2
}
loss_param {
ignore_label: -1
}
}
The important parts of the solver: I already have played a little bit with lr_policy: INV but in the end I tried it with fixed
net: "Basic.prototxt"
test_initialization: false
base_lr: 0.001
momentum: 0.9
lr_policy: "fixed"
display: 50
max_iter: 1000000
solver_mode: GPU
No sequence ranges over 2000.
I have put 10 sequences side by side.
I embedded my data in a one hot vector of size 132.
My data HDF5 file has these dimensions: XX*10*132*1
My data has a label at the end of each sequence. Every other label is -1 and will be ignored during backpropagation.
To increase efficiency I packed multiple short sequences together (they are below 2000 timesteps).
For classification I have used the python interface. When I classify a sequence following arises:
net.blobs['data'].reshape(726, 1, 132, 1)
net.blobs['cont'].reshape(726, 1)
net.blobs['data'].data[...] = data
net.blobs['cont'].data[...] = cont
output = net.forward()
output_prob = output['prob']
for i in range(726):
plt.plot(output_prob[i][0])
In the image one can see that for every timestep the same probabilities have been calculated.
I want to create a wizard for the logo badge below with 3 parameters. I can make the title dynamic but for image and gradient it's hardcoded because I can't see how to make them dynamic. Code follows after pictures:
alt text http://reboltutorial.com/bugs/wizard1.png
alt text http://reboltutorial.com/bugs/wizard2.png
custom-styles: stylize [
lab: label 60x20 right bold middle font-size 11
btn: button 64x20 font-size 11 edge [size: 1x1]
fld: field 200x20 font-size 11 middle edge [size: 1x1]
inf: info font-size 11 middle edge [size: 1x1]
ari: field wrap font-size 11 edge [size: 1x1] with [flags: [field tabbed]]
]
panel1: layout/size [
origin 0 space 2x2 across
styles custom-styles
h3 "Parameters" font-size 14 return
lab "Title" fld_title: fld "EXPERIMENT" return
lab "Logo" fld_logo: fld "http://www.rebol.com/graphics/reb-logo.gif" return
lab "Gradient" fld_gradient: fld "5 55 5 10 10 71.0.6 30.10.10 71.0.6"
] 278x170
panel2: layout/size [
;layout (window client area) size is 278x170 at the end of the spec block
at 0x0 ;put the banner on the top left corner
box 278x170 effect [ ; default box face size is 100x100
draw [
anti-alias on
line-width 2.5 ; number of pixels in width of the border
pen black ; color of the edge of the next draw element
fill-pen radial 100x50 5 55 5 10 10 71.0.6 30.10.10 71.0.6
; the draw element
box ; another box drawn as an effect
15 ; size of rounding in pixels
0x0 ; upper left corner
278x170 ; lower right corner
]
]
pad 30x-150
Text fld_title/text font [name: "Impact" size: 24 color: white]
image http://www.rebol.com/graphics/reb-logo.gif
] 278x170
main: layout [
vh2 "Logo Badge Wizard"
guide
pad 20
button "Parameters" [panels/pane: panel1 show panels ]
button "Rendering" [show panel2 panels/pane: panel2 show panels]
button "Quit" [Unview]
return
box 2x170 maroon
return
panels: box 278x170
]
panel1/offset: 0x0
panel2/offset: 0x0
panels/pane: panel1
view main
Make the block for the 2nd layout a template.
Put the variables you want there and surround with ( )
When rendering, do a copy/deep to make a template copy, then compose/deep to replace the variables as taken from the parameters screen, create the layout from your copy of the template and set the pane to the new layout.