Многоцветный градиент исчезает для текста без CSS?

Я хотел бы помочь заставить эту функцию PHP работать с третьей опцией цвета.

Примечание: нет CSS. Нет JavaScript Просто PHP и HTML.

<?php

function Gradient($HexFrom, $HexTo, $ColorSteps)
{
$FromRGB['r'] = hexdec(substr($HexFrom, 0, 2));
$FromRGB['g'] = hexdec(substr($HexFrom, 2, 2));
$FromRGB['b'] = hexdec(substr($HexFrom, 4, 2));

$ToRGB['r'] = hexdec(substr($HexTo, 0, 2));
$ToRGB['g'] = hexdec(substr($HexTo, 2, 2));
$ToRGB['b'] = hexdec(substr($HexTo, 4, 2));

$StepRGB['r'] = ($FromRGB['r'] - $ToRGB['r']) / ($ColorSteps - 1);
$StepRGB['g'] = ($FromRGB['g'] - $ToRGB['g']) / ($ColorSteps - 1);
$StepRGB['b'] = ($FromRGB['b'] - $ToRGB['b']) / ($ColorSteps - 1);

$GradientColors = array();

for($i = 0; $i <= $ColorSteps; $i++)
{
$RGB['r'] = floor($FromRGB['r'] - ($StepRGB['r'] * $i));
$RGB['g'] = floor($FromRGB['g'] - ($StepRGB['g'] * $i));
$RGB['b'] = floor($FromRGB['b'] - ($StepRGB['b'] * $i));

$HexRGB['r'] = sprintf('%02x', ($RGB['r']));
$HexRGB['g'] = sprintf('%02x', ($RGB['g']));
$HexRGB['b'] = sprintf('%02x', ($RGB['b']));

$GradientColors[] = implode(NULL, $HexRGB);
}
return $GradientColors;
}

$text = "blah testing blah testing blah";
$length = strlen($text);
$Gradients = Gradient("00FF00", "0000FF", $length);

for ($i=0; $i<$length; $i++) {
echo '<span style="color: #' . $Gradients[$i] . ';">' . $text[$i] . '</span>';
}?>

Что я должен сделать, чтобы получить третий вариант? Такие как:

Gradient($HexOne, $HexTwo, $HexThree, $ColorSteps)
//^^^^^^^^^

2

Решение

Это должно работать для вас:

В общем, я только что добавил, что если вы предоставляете более 2 цветов, он просто объединяет первый градиент со следующим, пока у вас не появятся все градиенты, которые вы хотите вместе. Это также позволяет вам иметь различные шаги для каждого градиента, который у вас есть. Таким образом, вы можете определить, что он должен перейти от зеленого к красному за 20 шагов и от красного до синего за 50 шагов.

Вы можете передать цвета как массив, а шаги как массив или целое число, когда вы берете экземпляр класса. Или вы можете использовать методы setColors() установить массив цветов и setSteps() установить массив или целое число в качестве интервала.

Вы также можете определить, должен ли градиент быть фрагментированным или нет, если у вас несколько цветов. Вы можете установить и получить значение, если оно должно быть разделено на setChunkedGradientState() а также getChunkedGradientState(), Это просто означает, что если вы не хотите использовать градиент, который является значением по умолчанию, вы получите массив, подобный этому:

Array
(
[0] => FD9B09
[1] => EBAE1C
[2] => D9C230
[3] => C7D544
[4] => B6E958
[5] => B6E958
[6] => A9EC8D
[7] => 9CEFC2
[8] => 8FF2F8
)

Если это будет разделено на части, вы получите массив, подобный этому:

Array
(
[0] => Array
(
[0] => FD9B09
[1] => EBAE1C
[2] => D9C230
[3] => C7D544
[4] => B6E958
)

[1] => Array
(
[0] => B6E958
[1] => A9EC8D
[2] => 9CEFC2
[3] => 8FF2F8
)
)

полный код:

<?phpclass Gradienter {

public $colors = [];
public $gradient = [];
public $colorSteps = 2;
public $chunkedGradient = FALSE;

public function __construct(array $colors = [], $colorSteps = 2, $chunkedGradient = FALSE) {
$this->setColors($colors);
$this->setSteps($colorSteps);
$this->setChunkedGradientState($chunkedGradient);

return $this;
}public function getGradient() {

if(count($this->colors) == 2) {
$this->createSingleGradient();
} elseif(count($this->colors) > 2) {
$this->createMultipleGradient();
} else {
throw new Exception("Not enough colors provided");
}

if($this->chunkedGradient)
$this->getChunkedGradient();

return $this->gradient;

}

public function getChunkedGradient() {

$stepCount = count($this->colors) - 1;
for($count = 0; $count < $stepCount; $count++) {
if(!is_array($this->colorSteps))
$gradient[] = array_splice($this->gradient, 0, $this->colorSteps);
elseif(!isset($this->colorSteps[$count]))
$gradient[] = array_splice($this->gradient, 0, 2);
else
$gradient[] = array_splice($this->gradient, 0, $this->colorSteps[$count]);
}
$this->gradient = $gradient;

}

public function createSingleGradient() {

if(!is_array($this->colorSteps))
$this->$gradient = $this->createGradient($this->colors[0], $this->colors[1], $this->colorSteps);
else
$this->$gradient = $this->createGradient($this->colors[0], $this->colors[1], $this->colorSteps[0]);

}

public function createMultipleGradient() {

foreach($this->colors as $k => $color) {
if(!isset($this->colors[$k+1]))
break;

if(!is_array($this->colorSteps))
$this->gradient = array_merge($this->gradient, $this->createGradient($this->colors[$k], $this->colors[$k+1], $this->colorSteps));
elseif(isset($this->colorSteps[$k]))
$this->gradient = array_merge($this->gradient, $this->createGradient($this->colors[$k], $this->colors[$k+1], $this->colorSteps[$k]));
else
$this->gradient = array_merge($this->gradient, $this->createGradient($this->colors[$k], $this->colors[$k+1], 2));

}

}

public function createGradient($start, $end, $interval) {
$colors = ["r", "g", "b"];
list($colorStart["r"], $colorStart["g"], $colorStart["b"]) = array_map("hexdec", str_split($start, 2));
list($colorEnd["r"], $colorEnd["g"], $colorEnd["b"]) = array_map("hexdec", str_split($end, 2));

foreach($colors as $color)
$colorSteps[$color] = ($colorStart[$color] - $colorEnd[$color]) / ($interval - 1);

for($count = 0; $count < $interval; $count++) {
foreach($colors as $color)
$rgb[$color] = floor($colorStart[$color] - ($colorSteps[$color] * $count));

$hexRgb = array_combine($colors, array_map(function($v){
return substr(sprintf('%02X', $v), 0, 2);
}, $rgb));

$GradientColors[] = implode("", $hexRgb);
}

return $GradientColors;

}

public function setColors(array $colors = []) {
$this->colors = $colors;
return $this;
}

public function getColors() {
return $this->colors;
}

public function setSteps($colorSteps = 2) {
if(!is_array($colorSteps))
$this->setSingleColorSteps($colorSteps);
else
$this->setMultipleColorSteps($colorSteps);
return $this;
}

public function setSingleColorSteps($colorSteps) {
$this->colorSteps = intval($colorSteps < 2 ? 2 : $colorSteps);
}

public function setMultipleColorSteps($colorSteps) {
$this->colorSteps = array_map(function($v){
return intval($v < 2 ? 2 : $v);
}, $colorSteps);
}

public function getSteps() {
return $this->colorSteps;
}

public function setChunkedGradientState($chunkedGradient) {
$this->chunkedGradient = $chunkedGradient;
return $this;
}

public function getChunkedGradientState() {
return $this->chunkedGradient;
}}
$gradienter = new Gradienter();
$gradienter->setColors(["FD9B09", "B6E958", "F2F90B", "8FF2F8", "FB8CF8", "F05C3E"]);
$gradienter->setSteps([5, 30, 25, 60, 40]);

$gradients = $gradienter->getGradient();

foreach($gradients as $k => $color)
echo "<div style='background-color:#" . $color . "'>" . $color . "</div>";?>

Демо 1
Демо 2

1

Другие решения

Других решений пока нет …

По вопросам рекламы ammmcru@yandex.ru
Adblock
detector