c# Граничный Пробельный Алгоритм обнаружения GDI
Первоначальный ответ (прежде чем я понял, о чем вы спрашиваете):
В зависимости от того, как вы хотите заказать, вы можете использовать columns [ 1117] ...
div {
font-size: 30px;
padding: 30px;
}
ul {
display: inline-block;
column-width: 35px;
padding: 0;
list-style: none;
font-size: 10px;
columns: 2 0px;
}
li {
background: #9eff80;
margin: 1px;
padding: 2px;
opacity: 0.7;
width: 100%;
break-inside: avoid;
}
I'd like to have a list with several columns
- A list
- like this
- with unknown
- number and items
- or columns.
in the middle of other text.
... или display:inline-flex. Вам нужно установить max-width для детей, установить flex-wrap: wrap для родителя и указать желаемое vertical-align для родителя:
div {
font-size: 30px;
padding: 30px;
}
ul {
display: inline-flex;
padding: 0;
list-style: none;
font-size: 10px;
flex-wrap: wrap;
line-height: 5em;
vertical-align: middle;
/* see also -webkit-baseline-middle
text-bottom
text-top */
}
li {
line-height: 1em;
flex: 0 1 auto;
margin: 1px;
width: calc(50% - 2px); /*deduct margin*/
background: #9eff80;
padding: 2px;
opacity: 0.7;
box-sizing: border-box;
}
I'd like to have a list with several columns
- A list
- like this
- with unknown
- number and items
- or columns.
in the middle of other text.
Вероятно, наиболее важной частью всего этого является удаление height: 35px; из ul. Зачем вы все это жестко закодировали, если «Число элементов в списке неизвестно» ?
Правильный ответ (как этого можно достичь) :
Похоже, вы хотите, чтобы ваши элементы отображались в виде неопределенной серии встроенных блоков, каждый из которых содержит 2 элемента или меньше. Вы все еще должны определить, что должно произойти, когда содержимое ваших 2 элементов превысит желаемую высоту 35px.
Вот как вы можете добиться этого, используя ванильный JavaScript. Если возможно, вы должны сделать это на стороне сервера, хотя:
let uls = document.querySelectorAll('ul');
for(let i = 0; i < uls.length; i++) {
let count = uls[i].children.length;
if (count && count > 2) {
for (j = 0; j < count/2; j++) {
let parent = uls[i].parentElement,
newUl = document.createElement('ul');
for (k = 0; k < 2; k++) {
li = uls[i].querySelector(':first-child');
if (li) {
newUl.appendChild(li);
parent.insertBefore(newUl, uls[i]);
}
}
}
}
}div {
font-size: 30px;
padding: 30px;
}
ul {
display: inline-block;
padding: 0;
list-style: none;
font-size: 10px;
vertical-align: middle;
min-height: 35px;
}
li {
background: #9eff80;
padding: 2px;
margin: 1px;
opacity: 0.7;
}
I'd like to have a list with several columns
- A list
- like this
- with unknown
- number and items
- or columns.
- A list
- like this
- with unknown
- number and items
- or columns.
- A list
in the middle of other text. I'd like to have a list with several columns
- A list
- like this
- with unknown
- number and items
- or columns.
- A list
- like this
- with unknown
- number and items
- or columns.
- A list
in the middle of other text.
Это один из случаи, когда jQuery будет намного короче:
$('ul').each(function() {
while($('li', this).length > 2) {
let newUl = $('
'), i = 0;
while(i < 2) {
$('li', this).eq(0).appendTo(newUl);
i++;
}
newUl.insertBefore($(this));
}
})
2 ответа
Большой GDI + ресурс Bob Powells GDI + FAQ!
Вы не сказали, как Вы получили доступ к пикселям в изображении, таким образом, я предположу, что Вы использовали медленные методы GetPixel. Можно использовать указатели и LockBits для доступа к пикселям более быстрым способом: видят объяснение Bob Powells LockBits - Это потребует небезопасного блока кода - если Вы не захотите это, или у Вас нет FullTrust, можно использовать прием, объясненный здесь: Обработка изображений Без указателя в.NET J. Dunlap
ниже кода использует подход LockBits (для PixelFormat. Format32bppArgb), и заполнит запуск и конечные точки со значением, где первые и последние пиксели в изображении обнаружены, которым не описали цвет в цвете аргумента. Метод также игнорирует абсолютно прозрачные пиксели, который полезен, если Вы хотите обнаружить область изображения, где видимое 'содержание' запускается.
Point start = Point.Empty;
Point end = Point.Empty;
int bitmapWidth = bmp.Width;
int bitmapHeight = bmp.Height;
#region find start and end point
BitmapData data = bmp.LockBits(new Rectangle(0, 0, bitmapWidth, bitmapHeight), ImageLockMode.ReadOnly, PixelFormat.Format32bppArgb);
try
{
unsafe
{
byte* pData0 = (byte*)data.Scan0;
for (int y = 0; y < bitmapHeight; y++)
{
for (int x = 0; x < bitmapWidth; x++)
{
byte* pData = pData0 + (y * data.Stride) + (x * 4);
byte xyBlue = pData[0];
byte xyGreen = pData[1];
byte xyRed = pData[2];
byte xyAlpha = pData[3];
if (color.A != xyAlpha
|| color.B != xyBlue
|| color.R != xyRed
|| color.G != xyGreen)
{
//ignore transparent pixels
if (xyAlpha == 0)
continue;
if (start.IsEmpty)
{
start = new Point(x, y);
}
else if (start.Y > y)
{
start.Y = y;
}
if (end.IsEmpty)
{
end = new Point(x, y);
}
else if (end.X < x)
{
end.X = x;
}
else if (end.Y < y)
{
end.Y = y;
}
}
}
}
}
}
finally
{
bmp.UnlockBits(data);
}
#endregion
Я сначала удостоверился бы, что использовал метод LockBits, описанный Patrick. Второй я проверил бы пиксели на средних строках для быстрого определения краев. Средними строками я имею в виду, если бы Вы высказываетесь, например, 2000x1000 изображение, Вы выглядели бы первыми вдоль горизонтального номера строки 500 (из 1 000), чтобы найти, что левые и правые пределы, затем вдоль вертикального номера строки 1000 (из 2000) находят верхние и нижние пределы. Это должно быть очень быстро этот путь.